JS如何显示和隐藏一个表格中的所有表单输入框。

现在是想要把表格的补货一栏去掉,在表格底部加一个按钮,点击以后已补货的数字变成输入框。然后再次点击以后提交。我想要的是一个按钮,控制所有“已补货”列,所有数字都变成输入框... 现在是想要把表格的补货一栏去掉,在表格底部加一个按钮,点击以后 已补货的数字变成输入框。然后再次点击以后提交。

我想要的是一个按钮,控制所有“已补货”列,所有数字都变成输入框。
<tr>
<td> </td>
<td><span class="content">0</span></td></tr>
展开
 我来答
匿名用户
推荐于2016-06-23
展开全部
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8" />
<title>last.html</title>
<style>
table{
border: 1px solid green;
border-collapse: collapse;
}

td,th {
border: 1px solid green;
text-align: center;
}

th {
background-color: green;
color: white;
}
</style>
<script type="text/javascript">
var updateToSubmit = function (btn)
{
if (btn.value == '提交')
        {
        return true;
        }
var tbody = table.tBodies[0];
var trs = tbody.rows;
for ( var i = 1; i < trs.length - 1; i++)
        {
        var td = trs[i].cells[0];
      var text = document.createElement('input');
      text.type = 'text';
      text.style.textAlign = 'center';
      text.style.width = '50px';
      text.value = td.firstChild.nodeValue;
      td.removeChild(td.firstChild);
      td.appendChild(text);
        }
if (btn.value == '修改')
        {
btn.value = '提交';
return false;
        }
}
</script>
</head>
<body>
<form action="">
<table id="table">
<tr><th>已补货</th></tr>
<tr><td>0</td></tr>
<tr><td>0</td></tr>
<tr><td>0</td></tr>
<tr><td>0</td></tr>
<tr><td>0</td></tr>
<tr><td>0</td></tr>
<tr><td>0</td></tr>
<tr><td>0</td></tr>
<tr><td>0</td></tr>
<tr><td>0</td></tr>
<tr><td>0</td></tr>
<tr><td><input type="submit" onclick="return updateToSubmit(this);" value="修改" /></td></tr>
</table>
</form>
</body>
</html>
更多追问追答
追问
  没有错的,是要这个效果的,但是这个只能控制表格第一列的数据,有没有办法是控制表格里面加了class是content的数据,
好像下面这样,我需要点击以后0
这个列变输入框,其他列数据不要变。
追答
你的需求变了,供不应求
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式