用js做动态修改表单数据,修改按扭不能用,不知道代码哪里有问题,求助 10
functioneditRow(){varrow=document.getElementById("myTable").rowIndex;varcol=document....
function editRow(){
var row=document.getElementById("myTable").rowIndex;
var col=document.getElementById("myTable").cells;
var text=col[1].innerHTML;
col[1].innerHTML="<input name='num' type='text' value='"+text+"' /> ";
col[3].lastChild.value="确定";
col[3].lastChild.setAttribute("onclick","upRow()");
col[3].innerHTML="<input name='edit' type='button' value='确定' onclick='upRow()' />";
}
我想要的效果是点击修改按扭,左边的数量变成文本框 展开
var row=document.getElementById("myTable").rowIndex;
var col=document.getElementById("myTable").cells;
var text=col[1].innerHTML;
col[1].innerHTML="<input name='num' type='text' value='"+text+"' /> ";
col[3].lastChild.value="确定";
col[3].lastChild.setAttribute("onclick","upRow()");
col[3].innerHTML="<input name='edit' type='button' value='确定' onclick='upRow()' />";
}
我想要的效果是点击修改按扭,左边的数量变成文本框 展开
2个回答
展开全部
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>
RunJS 演示代码
</title>
<style>
*{
margin:0;
outline:none;
}
table{
margin:20px auto;
width:600px;
border:1px solid black;
border-collapse:collapse;
}
th,td{
border:1px solid black;
text-align:center;
}
th>a{
font:normal 10px consolas;
text-decoration:none;
color:#fd3;
}
th>a:hover{
color:red;
}
td>input[type=text]{
width:80px;
text-align:center;
}
td>input[type=button]{
border:0;
border-radius:10px;
}
td>input[type=button]:hover{
background-color:#fd3;
}
</style>
<script>
onload = function(){
}
function add (){
var tr = myTable.insertRow(myTable.rows.length);
var arr = [
"<input type='text' />",
"<input type='text' />",
"<input type='text' />",
"<input type='button' value='删除' onclick='del(this)' /> <input type='button' value='保存' onclick='save(this)' />"
];
for(var i = 0; i < arr.length; i++){
var td = tr.insertCell(tr.cells.length);
td.innerHTML = arr[i];
}
}
function save(btn){
var tr = btn.parentElement.parentElement;
if(btn.value == '保存'){
for(var i = 0; i < tr.cells.length - 1; i++){
var td = tr.cells[i];
td.innerHTML = td.children[0].value;
}
btn.value = '修改';
}else{
for(var i = 0; i < tr.cells.length - 1; i++){
var td = tr.cells[i];
td.innerHTML = "<input type='text' value='"+td.innerHTML+"' />";
}
btn.value='保存';
}
}
function del(btn){
var tr = btn.parentElement.parentElement;
myTable.deleteRow(tr.rowIndex);
}
</script>
</head>
<body>
<table id="myTable">
<tr>
<th>
书名
</th>
<th>价格</th>
<th>数量</th>
<th>操作 <a href='###' onclick='add()'>新增一行</a></th>
</tr>
</table>
</body>
</html>
本回答由网友推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
|
广告 您可能关注的内容 |
