gpt4 book ai didi

jquery - 检查同一行中的复选框是否被选中

转载 作者:行者123 更新时间:2023-12-01 03:15:23 25 4
gpt4 key购买 nike

当选择同一行中的两个复选框时,我试图弹出错误消息/警报。我已经能够计算复选框的总数,并且我知道如何计算当前选中的复选框的数量。我的每个复选框都有一个唯一的 ID。

<body>
<table id="tester">
<tr>
<td width="100" id="A1" ><label><input type="checkbox" name="A" value=1 id="A1" /> A1</label></td>
<td width="100" id="B1" ><label><input type="checkbox" name="B" value=1 id="B1" /> B1</label></td>
</tr>
<tr>
<td width="100" id="A2" ><label><input type="checkbox" name="A" value=1 id="A2" /> A2</label></td>
<td width="100" id="B2" ><label><input type="checkbox" name="B" value=1 id="B2" /> B2</label></td>
</tr>
</table>
<input id="clickMe" type="button" value="clickme" onclick="test();" />
</body>

我的 jquery 技能非常基础。这是我用来计算框数和选中框数的代码。

    $(document).ready();
var len = $('input:checkbox').length;
console.log("There are "+len+" checkboxes");
var count2;
var test = function(){
var count2 = $("[type='checkbox']:checked").length;
console.log("There are "+count2+" checked checkboxes");
};

任何帮助都会很棒,谢谢!

最佳答案

您可以使用.each()方法:

$('#tester tr').each(function(){
var l = $(this).find('input[type=checkbox]:checked').length;
if (l === 2) alert('2 checkboxes are checked');
});

或者.filter()方法:

$('#tester tr').has('input[type=checkbox]').filter(function() {
return $(this).find('input[type=checkbox]:checked').length === 2;
}).addClass('error');

请注意,如果您想阻止表单提交,则应在提交事件上验证表单元素,并且应避免使用 alert 功能来提供更好的用户体验。

var $form = $('#tester'),
$tr = $form.has('input[type=checkbox]');

$tr.find('input[type=checkbox]').on('change', function() {
var $tr = $(this).closest('tr'),
checked = $tr.find('input[type=checkbox]:checked').length;
$tr.toggleClass('error', checked === 2);
});

$form.on('submit', function() {
return $tr.filter('.error').length === 0;
});

Demo on jsFiddle.net

关于jquery - 检查同一行中的复选框是否被选中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16763324/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com