- jsp中 使用js實現 行內修改
-
怎樣用js實現行內修改
表格一行共有5列數據 第6列為修改按鈕 點擊修改 第四列和第五列變成可編輯的文本框，修改變成“確定”和“取消” 確定修改後保存到數據庫中
ps:修改另一行時要判斷之前是否有正在編輯的文本框
最佳回答：
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td><a href="javascript:void(0);" onclick="onEdit(this.parentNode.parentNode)">修改</a></td>
</tr>
function onEdit(trObj){
var inputs = document.getElementsByName('tempInput');//判斷是否有文本框
if(inputs.length>0){
alert("正在編輯");
return;
}
var tds = document.getElementsByTagName('td');
trObj.lastChild.innerHTML = '<a href="javascript:void(0);" onclick="onShow(this.parentNode.parentNode)">保存</a>';
tds[3].innerHTML = '<input name="tempInput" type="text" />';
tds[4].innerHTML = '<input name="tempInput" type="text" />';
}
function onShow(trObj){
// 保存操作
trObj.lastChild.innerHTML = '<a href="javascript:void(0);" onclick="onEdit(this.parentNode.parentNode)">修改</a>';
var tds = document.getElementsByTagName('td');
tds[3].innerHTML = tds[3].firstChild.value;
tds[4].innerHTML = tds[4].firstChild.value;
}
