1.最初にページ内のテーブルフレームを構成します
<tr> <td>パラメーターの追加：</td> <td> <入力タイプ= "ボタン"値 "value =" onclick = "openappparamspage（）;"/> </td> <td>パラメーターリスト：</td> <td> <入力タイプ= "hidden" = "id =" parmslist "names ="/td> </< cellpacing = "1" cellpadding = "0" style = ""> <tr> <td valign = "top" align = "center">パラメーター名：</td> <td valign = "top" align = "center">パラメーターエンコーディング：</td> <td valign = "top" align = "center"> paragent </tr> <tbody id = "sortlist"> </tbody> </table> </tr> <td align = "center" colspan = "4"> <input inpt = "submit" value = "save" onclick = "setparamslist（）
2。関連JS関数
function setParamsList（）{var tab = document.getElementById（ "tab"）; //テーブル行Var rows = tab.rows.length; //テーブル列varセル= tab.rows.item（0）.cells.length; // alert（ "rows"+rows+"列"+セル）; var rowdata = ""; for（var i = 1; i <rows; i ++）{var cellsdata = new Array（）; for（var j = 0; j <cells-1; j ++）{cellsdata.push（tab.rows [i] .cells [j] .innertext）; } rowdata = rowdata + "|" + cellsdata; } document.getElementById（ "paramslist"）。value = rowdata; } //関連する新しいアプリケーションパラメーターインターフェイス関数OpenAppParamSpage（）{var param = new object（）; //このパラメーターを渡す必要があります。 param.win = window; 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（result）; } //アプリケーションパラメーター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）; cell = document.createelement（ "td"）; Cell.AppendChild（document.createTextNode（paramcode））; row.AppendChild（Cell）; 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）; }; cell = 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）; }}添付のテーブルの変更関数
//更新インターフェイスの情報をポップアップしますupdatesort（id）{if（id！= null）{var row = document.getElementbyId（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 = window; param.id = 100; param.name = "test"; param.birthday = new date（）; var result = window.showmodaldialog（baseurl + "app/updateParamsitem？id =" + id + "¶mname=" + paramname + "¶mcode=" + paramcode + "¶mvalue=" + loaralue、 "dialogwidth：500px; dialogleft：200px; dialogleft; dialogleft; 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" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns = "http://www.w3.org/1999/xhtml"> <head> <meta http-equiv = "content-type" content = "text/html; charse <div> </div> <form> <table cellpacing = "1" cellpadding = "2"> <tr> <td>パラメーター名：</td> <td> <入力タイプ= "テキスト" maxlength = "20" "要求="真 "id =" paramname "name =" paramname "/>> </td> </td <td </td </td> <td> <td> <td> <td> <td> <td> type = "text" maxlength = "20"必須= "true" id = "paramcode" name = "paramcode" reby = "true"/> </td> </tr> <tr <td>パラメーター値：</td> <td> <入力タイプ= "テキスト" maxlength = "20" "rebuly =" embalue "/</</> </> </t =" pramvalue " <tr> <td align = "center" colspan = "4"> <input type = "" value = "save" onclick = "returnResult（）;"/> <入力型= "value =" return "onclick =" closewindow（）; //ウィンドウを閉じる直接機能closewindow（）{window.close（）; } //アセンブリreturnResult（）{if（！$（ 'form'）。valid（））return;の後に値を取得し、return returnResult（）{）{if（ 'form'）。 var paramname = document.getElementById（ "paramname"）; var paramcode = document.getElementById（ "paramcode"）; var paramvalue = document.getElementById（ "paramvalue"）; // alert（ "value is" + paramname.value + "、" + paramcode.value + "、" + paramvalue.value）; var result = paramname.value + "、" + paramcode.value + "、" + paramvalue.value; window.returnvalue = result; window.close（）; } </script>上記は、JS実装の動的テーブルの追加、変更、削除関数（推奨）の完全な説明です。それがあなたに役立つことを願っています。ご質問がある場合は、メッセージを残してください。編集者は時間内に返信します。 wulin.comのウェブサイトへのご支援ありがとうございます！