<td>第一个单元格</td>
<td>
<input readonly=true type='text' id='itemName' name='itemName' value=‘1’ />
</td>
<td><input disabled=true type='radio' onclick='' name='radio"+list[i].id+"' value=0 />是
<input disabled=true type='radio' name='radio"+list[i].id+"' value=1 />否
</td>
<td>
<a href='javascript:void(0);' onclick='deleteItem()'>删除</a>
<a href='javascript:void(0);' onclick='updateItem(this)'>编辑</a>
<a href='javascript:void(0);' style='display: none' onclick='save2update()'>保存</a>
</td>
</tr>
js
function updateItem(obj){
obj.nextElementSibling.style.display='inline'; // 设置后一个a链接的样式
obj.previousElementSibling.style.display='none'; // 设置前一个a链接的样式
//设置当前行中的第二个td中input的readOnly
obj.parentNode.parentNode.childNodes[1].getElementsByTagName("INPUT")[0].readOnly=false;
//设置当前行中的第三个td中input的disabled
obj.parentNode.parentNode.childNodes[2].getElementsByTagName("INPUT")[0].disabled=false;
obj.parentNode.parentNode.childNodes[2].getElementsByTagName("INPUT")[1].disabled=false;
}
本文介绍了一个简单的表格编辑功能实现方案,包括如何通过JavaScript操作DOM元素来实现单元格内容的编辑、保存及删除等功能。

被折叠的 条评论
为什么被折叠?



