以struts2的标签为例
1.select控件的添加和删除
<s:select list="availableAsset" key="asset.name" name="asset.id" listKey="id" listValue="name" headerKey="-1" headerValue="请
选择" />
添加一个option
function addOption1(){
var options=document.getElementsByName("asset.id")[0];
var option=new Option(id,name);//id为option的value,name为option显示的内容
options.add(option);
}
function addOption2(){
var options=document.getElementsByName("asset.id")[0];
options[options.length+1]=new Option(id,name) //id为option的value,name为option显示的内容
}
删除option
function deleteOption1(){
var options=document.getElementsByName("asset.id")[0];
options.remove(i); //i为options的第几项
}
function deleteOption2(){
var options=document.getElementsByName("asset.id")[0];
options[i]=null; //i为options的第几项
}
function deleteAllOption(){
var options=document.getElementsByName("asset.id")[0];
for(i=options.length;i>=0;i--){
options[i]=null; //i为options的第几项
或者是
options.remove(i); //i为options的第几项
}
//注意要删除select里面的全部选项时一定要倒叙删除
//因为每删除一个option时option的下标就要重新排列一次
//比如一共有5项option,option的最大下标为5,当你正序删除时第一次删除下标为1的option然后option的
//下标重新排列
//最大的下标就为4了所以最后一个option就删不掉。
}
2.table控件添加和删除
<table>
<tbody id="tableId">
<tr>
<th>姓名</th>
<th>班级</th>
<th>科目</th>
<th>分数</th>
</tr>
<tr id="trId1">
<td>李磊</td>
<td>一班</td>
<td>语文</td>
<td>78</td>
</tr>
</tbody>
</table>
添加一行
function addTableTr1(){
var table=document.getElementById("tableId");
var newRow=table.insertRow(i); //i=table.rowIndex+1
var newCell1=newRow.insertCell(0);
newCell1.innerHTML="王允";
var newCell2=newRow.insertCell(1);
newCell2.innerHTML="三班";
var newCell3=newRow.insertCell(2);
newCell3.innerHTML="数学";
var newCell4=newRow.insertCell(3);
newCell4.innerHTML="90";
}
function addTableTr2(){
var table=document.getElementById("tableId");
var newRow=table.insertRow(-1); //表示直接给table追加一行
var newCell1=newRow.insertCell(-1);//表示直接给tr追加一列
newCell1.innerHTML="田田";
var newCell2=newRow.insertCell(-1);
newCell2.innerHTML="三班";
var newCell3=newRow.insertCell(-1);
newCell3.innerHTML="数学";
var newCell4=newRow.insertCell(-1);
newCell4.innerHTML="76";
}
function addTableTr3(){
var tr=document.createElement("tr");
var td1=document.createElement("td");
td1.appendChild(document.createTextNode("舒蕾"));
var td2=document.createElement("td");
td2.appendChild(document.createTextNode("二班"));
var td3=document.createElement("td");
td3.appendChild(document.createTextNode("化学"));
var td4=document.createElement("td");
td4.appendChild(document.createTextNode("78"));
tr.appendChild(td1);
tr.appendChild(td2);
tr.appendChild(td3);
tr.appendChild(td4);
var table=document.getElementById("tableId");
table.appendChild(tr);
}
删除一行
function deleteTableTr1(){
var table=document.getElementById("tableId");
var rows=table.rows;
table.deleteRow(i);//i=table.rowIndex;
}