1. قم بتكوين إطار جدول أولاً في الصفحة
<tr> <td> المعلمات المضافة: </td> <td> <type type = "button" value = "select" onClick = "OpenapPParamSpage () ؛ cellpacing = "1" cellpadding = "0" style = ""> <tr> <td valign = "top" align = "center"> اسم المعلمة: </td> <td valign = "top" align = "center> idding: </td> <td valign =" top "align =" </r> <tbody id = "sortlist"> </tbody> </table> </tr> <tr> <td align = "center" colspan = "4"
2. وظائف JS ذات الصلة
وظيفة setParamSlist () {var tab = document.getElementById ("tab") ؛ // Table Rows var rows = tab.rows.length ؛ // أعمدة الجدول var cell = tab.rows.item (0) .Cells.Length ؛ // ALERT ("" الصفوف "+صفوف+" أعمدة "+خلايا) ؛ var rowdata = "" ؛ لـ (var i = 1 ؛ i <rows ؛ i ++) {var celldata = new array () ؛ لـ (var j = 0 ؛ j <cells-1 ؛ j ++) {cellsdata.push (tab.rows [i] .cells [j] .innertext) ؛ } rowdata = rowdata + "|" + cellsdata ؛ } document.getElementById ("paramslist"). value = rowdata ؛ } // افتح وظيفة واجهة المعلمة الجديدة ذات الصلة OpenAPParamSpage () {var param = new Object () ؛ // يجب تمرير هذه المعلمة. param.win = نافذة ؛ param.id = 100 ؛ param.name = "test" ؛ param.birthday = new Date () ؛ var result = window.showmodaldialog ("addParamsitem" ، "DialogWidth: 500px ؛ dialogheight: 600px ؛ dialogleft: 200px ؛ dialogtop = 200px") ؛ // var temp = document.getElementById ("paramslist"). value ؛ //document.getElementById("paramslist").value = temp + result ؛ addsort (نتيجة) ؛ } // إضافة وظيفة معلمة التطبيق addSort (data) {var name = data ؛ if (name == "" || name == undefined) {return ؛ } console.log (data) ؛ var params = data.split ("،") ؛ var paramname = params [0] ؛ var paramcode = params [1] ؛ var paramvalue = params [2] ؛ var row = document.createElement ("tr") ؛ row.setAttribute ("id" ، paramcode) ؛ var cell = document.createElement ("td") ؛ cell.appendChild (document.createTextNode (paramname)) ؛ row.appendchild (Cell) ؛ الخلية = document.createElement ("TD") ؛ cell.appendChild (document.createTextNode (paramCode)) ؛ row.appendchild (Cell) ؛ الخلية = document.createElement ("TD") ؛ cell.appendChild (document.createTextNode (paramValue)) ؛ row.appendchild (Cell) ؛ var deletebutton = document.createElement ("input") ؛ deletebutton.setattribute ("type" ، "button") ؛ deletebutton.setattribute ("value" ، "delete") ؛ deletebutton.onclick = function () {deletesort (paramCode) ؛ } ؛ الخلية = document.createElement ("TD") ؛ Cell.AppendChild (DeleteButton) ؛ row.appendchild (Cell) ؛ document.getElementById ("sortlist"). appendChild (row) ؛ } // حذف وظيفة دالة المعلمة التطبيق deletesort (id) {if (id! = null) {var rowtoDeLete = document.getElementById (id) ؛ var sortlist = document.getElementById ("sortlist") ؛ sortlist.removechild (rowtodelete) ؛ }}وظيفة التعديل للجداول المرفقة
// pop up معلومات حول updates updatesort (id) {id) // ALERT ("row is" + row.cells [0] .innerhtml) ؛ var id = row.cells [0] .innerhtml ؛ var paramname = row.cells [1] .innerhtml ؛ var paramcode = row.cells [2] .innerhtml ؛ var paramvalue = row.cells [3] .innerhtml ؛ var param = new Object () ؛ // يجب تمرير هذه المعلمة. param.win = نافذة ؛ param.id = 100 ؛ param.name = "test" ؛ param.birthday = new Date () ؛ var result = window.showmodaldialog (baseurl + "app/updateParamSitem؟ id =" + id + "¶mname =" + paramname + "¶Mcode =" + paramcode + "¶mvalue =" + paramvalue ، "dialogwidth: 500px ؛ dialogheight: 600px ؛ var arr = result.split ("،") ؛ row.cells [0] .innerhtml = arr [0] ؛ row.cells [1] .innerhtml = arr [1] ؛ row.cells [2] .innerhtml = arr [2] ؛ row.cells [3] .innerhtml = arr [3] ؛ }}3. قم بإطفاء صفحة المربع ، إضافة أو تعديل المعلمات ، واكتب البيانات ذات الصلة.
<! doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" xmlns = "http://www.w3.org/1999/xhtml"> <head> <meta http-equiv = "content-type" content = "text/html ؛ charset = utf-8"/> <title> Add App </title> <include/heads> <viv> </viv> <port> <table cellpacing = "1" cellpadding = "2"> <tr> <td> اسم المعلمة: </td> <td> <type type = "text" maxLength = "20" "مطلوب =" true "id =" paramname "name =" paramname "/> </td> type = "text" maxLength = "20" required = "true" id = "paramcode" name = "paramcode" required = "true"/> </td> </tr> <tr> <td> value parameter: </td> <td> <td> <input type = "text" maxlength = "مطلوب =" true ". </tr> <tr> <td align = "center" colspan = "4"> <input type = "president" value = "save" onClick = "returnResult () ؛"/> <input type = "button" value = "return" onClick = "closeWindow () ؛"/> type = "text/javaScript"> // أغلق window function مباشرة closeWindow () {window.close () ؛ } // احصل على القيمة ، وظيفة الإرجاع بعد التجميع returnResult () {if (! $ ('form'). valid ()) return ؛ var paramname = document.getElementById ("paramname") ؛ var paramcode = document.getElementById ("paramcode") ؛ var paramvalue = document.getElementById ("paramValue") ؛ // ALERT ("القيمة هي" + paramname.value + "،" + paramcode.value + "،" + paramvalue.value) ؛ var result = paramname.value + "،" + paramcode.value + "،" + paramvalue.value ؛ Window.RETURNVALUE = النتيجة ؛ window.close () ؛ } </script>ما سبق هو الوصف الكامل لوظائف الإضافة والتعديل والحذف (الموصى بها) من الجداول الديناميكية لتنفيذ JS المقدمة لك. آمل أن يكون ذلك مفيدًا لك. إذا كان لديك أي أسئلة ، فيرجى ترك رسالة لي وسوف يرد المحرر إليك في الوقت المناسب. شكرا جزيلا لدعمكم لموقع wulin.com!