【发布时间】：2018-03-11 19:51:54
【问题描述】：
我创建了一个从数据库中填充的表单。
结果显示在屏幕上，默认情况下，我禁用除了每行的初始下拉列表之外的所有表单字段。
更改下拉列表的值应启用或禁用该特定行上的表单字段。这仅适用于第一行，不适用于后续行。
我认为这是因为我只引用了第一行，但我确定如何更改它..
这就是我到目前为止所得到的......记住这只有 2 行，实时数据可能会显示很多行。
<html>
<head>
<title>test</title>
<script src="jquery-1.8.0.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#option').change(function(){
if($(this).val()=="2"){
$("#name").removeAttr("disabled");
$("#id").removeAttr("disabled");
$("#home").removeAttr("disabled");
$("#active").removeAttr("disabled");
}
if($(this).val()!="2"){
$("#name").attr("disabled", "disabled");
$("#id").attr("disabled", "disabled");
$("#home").attr("disabled", "disabled");
$("#active").attr("disabled", "disabled");
}
});
});
</script>
</head>
<body>
<form id='usr' method='post' action='test.php'>
<table border='1' width='60%'>
<tr>
<th>Val1</th>
<th>Val2</th>
<th>Val3</th>
<th>Val4</th>
<th>Val5</th>
<th>Val6</th>
</tr>
<tr align='center'>
<td>
<select name='option' id='option' />
<option></option>
<option value='1'>Option1</option>
<option value='2'>Option2</option>
</select>
</td>
<td>USR1</td>
<td><input type='text' name='name[]' id='name' value='' disabled='disabled'/></td>
<td><input type='text' name='id[]' id='id' value='' disabled='disabled'/></td>
<td>
<select name='home[]' id='home' disabled='disabled'/>
<option value='North'>North</option>
<option value='South'>South</option>
<option value='Other'>Other</option>
</select>
</td>
<td>
<select name='active[]' id='active' disabled='disabled'/>
<option value=''></option>
<option value='1'>Yes</option>
<option value='2'>No</option>
<option value='3'>Dead</option>
<option value='4'>Other</option>
</select>
</td>
</tr>
<tr align='center'>
<td>
<select name='option' id='option' />
<option></option>
<option value='1'>Option1</option>
<option value='2'>Option2</option>
</select>
</td>
<td>USR2</td>
<td><input type='text' name='name[]' id='name' value='' disabled='disabled'/></td>
<td><input type='text' name='id[]' id='id' value='' disabled='disabled'/></td>
<td>
<select name='home[]' id='home' disabled='disabled'/>
<option value='North'>North</option>
<option value='South'>South</option>
<option value='Other'>Other</option>
</select>
</td>
<td>
<select name='active[]' id='active' disabled='disabled'/>
<option value=''></option>
<option value='1' >Yes</option>
<option value='2' >No</option>
<option value='3' >Dead</option>
<option value='4'>Other</option>
</select>
</td>
</tr>
</table>
</form>
</body>
</html>
谁能帮我让它适用于所有行。在行首选择下拉菜单时，它应该只影响该行。
【问题讨论】：
-
您所有的表单字段都具有相同的
name和id。您无法区分它们，因此浏览器默认为 first。这是您看到的行为。 -
谢谢，这就是我的假设。由于这是来自数据库，我可以将计数添加到每个 ID，因此它们将变为
name1、id1、name2、id2等但是我如何在 jquery 中引用它们？ -
这是jQuery不太擅长的部分。有一些解决方法，但它们都很讨厌。您可以尝试找到一些其他人如何使用动态生成的数据/表单的示例。
-
好的，我希望我能得到行 ID，然后用它来操作行..
-
是的，您可能可以这样做，寻找其他解决方案。
标签： php jquery forms html-table row