如何从动态表中选择一个或其他或没有复选框?
我创建了一个动态表。 在每一行中,我添加了两个复选框, buy
和sell
,每个都有一个.checkboxClass
类。 我希望用户能够选择buy
或sell
,但不能两者兼而有之。
到目前为止,这是我的代码:
$('input.checkboxClass').on('click', function() { $('input.checkboxClass').not(this).prop('checked', false); });
这仅适用于一行。 随着更多行的添加,它会失败。 这是因为checkboxClass
在整个表中都会重复,这意味着脚本只允许您一次选择一个复选框。
到目前为止,我无法相信没有人提出这个建议。 您的问题是对HTML的一般误解。 这不是复选框的用途。 你应该使用单选按钮:
由于你没有显示你的HTML,我想你有类似的东西:
Product 1 Buy Sell Product 2 Buy Sell Product 3 Buy Sell
JavaScript代码:
$('input.checkboxClass').on('click', function() { $(this).parent().parent().find('.checkboxClass').prop('checked', false); $(this).prop('checked', true) });
DEMO
注意1:您可以根据HTML结构调整JavaScript代码
注2:我宁愿在这个用例中使用无线电,而不是复选框