如何检查复选框数组中的复选框是否使用jquery进行检查 [英] How to check if a checkbox in a checkbox array is checked with jquery
问题描述
我有一个带有一列文本框（里程）的html表格，当页面加载时，它们全部被禁用，并且我需要当用户单击复选框时，文本框该列应该启用并成为必填字段，然后如果用户取消选中该复选框，则必须禁用该行上的文本框，并删除所需的类。
我已经拥有当用户点击相应的复选框时启用和禁用文本框（列里程）的功能，但它是用javascript编写的。但是，由于某种原因，它只能在IE中使用）。 p>
这里是html代码
< tbody>
< c：forEach items =$ {list}var =item>
< tr>
< td align =center>
< input type =checkboxname =selectItemsvalue =< c：out value =$ {item.numberPlate}/> onchange =enableTextField（this）/>
< / td>
< td align =left>< c：out value =$ {item.numberPlate}/>< / td>
< td align =left>< c：out value =$ {item.driver.fullName}/>< / td>
< td align =left>< input type =textname =miles_< c：out value =$ {item.numberPlate}/> value =disabled =true/>< / td>
< / tr>
< / c：forEach>
< / tbody>
以及javascript代码：
function enableTextField（r）
{var node = r.parentNode;
while（node&& node.tagName！=='TR'）{
node = node.parentNode;
}
var i = node.rowIndex;
if（document.form1.selectItems [i-1] .checked）
{
document.getElementById（'mileage_'+ document.form1.selectItems [ I-1〕。价值）.disabled = FALSE;
}
else
{
document.getElementById（'mileage_'+ document.form1.selectItems [i-1] .value）.value =;
document.getElementById（'mileage_'+ document.form1.selectItems [i-1] .value）.disabled = true;
}
}
现在，我知道为了添加或删除动态验证规则，我必须使用：addClass（'required'）; removeClass（'required'），但我不知道如何检测是否选中了复选框，并基于此启用或禁用该行的文本框。
我真的希望你能帮我解决这个问题。 把这个放在< head> 或位于< head> .js 文件
$（document）.ready（function（）{
$（input [name = selectItems （）））。change（function（）{
$（this）.closest（tr）。find（input [name ^ = mileage]）。attr（disabled，！this.checked） ;
}）;
}）;
I have a html table with a column of text boxes (mileage), all of them are disabled when the page loads, and I need that when user clicks on a check box, the text box for that column should be enabled and become a required field, and then if the user unchecks the checkbox, the textbox on that row must be disabled and the required class removed.
I already have the function to enable and disable the text boxes (column mileage) when the user clicks on the corresponding checkbox, but it is written in javascript.However, for some reason it only works in IE).
Here is the html code
<tbody>
<c:forEach items="${list}" var="item">
<tr>
<td align="center">
<input type="checkbox" name="selectItems" value="<c:out value="${item.numberPlate}"/>" onchange="enableTextField(this)" />
</td>
<td align="left"><c:out value="${item.numberPlate}"/></td>
<td align="left"><c:out value="${item.driver.fullName}"/></td>
<td align="left"><input type="text" name="mileage_<c:out value="${item.numberPlate}"/>" value="" disabled="true"/></td>
</tr>
</c:forEach>
</tbody>
And the javascript code:
function enableTextField(r)
{ var node = r.parentNode;
while( node && node.tagName !== 'TR' ) {
node = node.parentNode;
}
var i=node.rowIndex;
if(document.form1.selectItems[i-1].checked)
{
document.getElementById('mileage_' + document.form1.selectItems[i-1].value).disabled=false;
}
else
{
document.getElementById('mileage_' + document.form1.selectItems[i-1].value).value="";
document.getElementById('mileage_' + document.form1.selectItems[i-1].value).disabled=true;
}
}
Now, I know that in order to add or remove dynamically validation rules I have to use: addClass('required'); o removeClass('required') ,but I don't know how to detect whether a check box is selected or not, and based on that ,enable or disable the text box for that row.
I really hope you can help me out with this.
Put this in <head> or in a .js file which is included in <head>.
$(document).ready(function() {
$("input[name=selectItems]").change(function() {
$(this).closest("tr").find("input[name^=mileage]").attr("disabled", !this.checked);
});
});
这篇关于如何检查复选框数组中的复选框是否使用jquery进行检查的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
