复选框和 JQUERY：“已选中”始终为 FALSE
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/865513/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Checkbox and JQUERY: "is checked" always FALSE
提问by uzay95
The code is below and checkbox is always FALSE. But on page it is different. It doesn't get checked or unchecked.
代码如下，复选框始终为 FALSE。但在页面上它是不同的。它不会被选中或取消选中。
<script type="text/javascript">
$('.cbOzelHastaAdi').unbind('click');
$('.cbOzelHastaAdi').click( function() {
var parentDiv = $(this).parent().get(0);
var cbs = $(parentDiv).find('table input:checkbox');
if($(this).attr("checked") === "true") {
cbs.each(function() { $(this).attr('checked', false); });
}
else{
cbs.each(function() { $(this).attr('checked', true); });
}
})
</script>
回答by Russ Cam
One of the problems was that you had the checkedattribute on the span surrounding the top checkbox and label and were binding an event handler to the span, therefore checkedwill always remain checkedon the span.
问题之一是您checked在顶部复选框和标签周围的范围上具有属性，并且将事件处理程序绑定到范围，因此checked将始终保留checked在范围内。
I have moved the event handlers to the checkbox instead and tidied up the code a bit. Whilst I don't believe there is a problem in constructing your own attributes on HTML elements i.e. a checked attribute on a span element (I think XHTML strict validation fails with them), I don't whether it's considered good practice to do so.
我已将事件处理程序移至复选框，并稍微整理了一下代码。虽然我不认为在 HTML 元素上构建自己的属性存在问题，即在 span 元素上检查属性（我认为 XHTML 严格验证会失败），但我不认为这样做是否被认为是好的做法。
I can see that you are using ASP.NET, based on the ID mangling - you can use server side <%= myControl.ClientID %>to get the mangled id to render in the HTML sent to the client.
我可以看到您正在使用 ASP.NET，基于 ID 修改 - 您可以使用服务器端<%= myControl.ClientID %>获取修改后的 ID，以在发送到客户端的 HTML 中呈现。
$(function() {
$('#rptOzel_ctl00_rptOzelHastalar_ctl00_cbOzelKurumHastasi').unbind('click');
$('#rptOzel_ctl00_rptOzelHastalar_ctl00_cbOzelKurumHastasi').click( function() {
var cbs = $('table input:checkbox');
if($(this).is(':checked')){
cbs.each(function() { $(this).attr('checked', true); });
}
else{
cbs.each(function() { $(this).attr('checked', false); });
}
});
});
EDIT:
编辑：
In response to your comment, you have a couple of options for resolving the clientid. If you write your jQuery in the aspx page, then you can simply use
为了回应您的评论，您有几个选项可以解析 clientid。如果您在 aspx 页面中编写 jQuery，那么您可以简单地使用
$('#<%= cbOzelKurumHastasi.ClientID %>')
$('#<%= cbOzelKurumHastasi.ClientID %>')
in place of
代替
$('#rptOzel_ctl00_rptOzelHastalar_ctl00_cbOzelKurumHastasi')
$('#rptOzel_ctl00_rptOzelHastalar_ctl00_cbOzelKurumHastasi')
If you have your jQuery in an external script file then you could put this in your aspx page
如果你的 jQuery 在一个外部脚本文件中，那么你可以把它放在你的 aspx 页面中
<script type="text/javascript">
var cbOzelKurumHastasi = '#<%= cbOzelKurumHastasi.ClientID %>';
</script>
and then use the variable in your external script file
然后在外部脚本文件中使用该变量
$(function() {
$(cbOzelKurumHastasi).unbind('click');
$(cbOzelKurumHastasi).click( function() { ...
For other options take a look at this question and answer - How to stop ASP.NET from changing ids in order to use jQuery
对于其他选项，请查看此问题和答案 - How to stop ASP.NET from changes ids to use jQuery
回答by Corey Downie
I usually us the .is() functionality of jQuery to check for this
我通常使用 jQuery 的 .is() 功能来检查这个
$('.cbOzelHastaAdi').click( function() {
if($(this).is(':checked')){
...
}else{
...
}
})
回答by Venr
could it be because you are comparing the value of the checked property to a string rather than a boolean and using the === operator which compares both value and type?
可能是因为您将检查属性的值与字符串而不是布尔值进行比较，并使用 === 运算符来比较值和类型？
回答by Wouter Mevius
I came across the same problem ones; checking whether a checkbox is checked ( in any of the different ways) always returned false.
我遇到了同样的问题；检查复选框是否被选中（以任何不同的方式）总是返回 false。
My solution (course of problem) was in the JQuery selector that was used.
我的解决方案（问题的过程）是在使用的 JQuery 选择器中。
uzay95 used the class selector ".", to select its checkboxes.
uzay95 使用类选择器“.”来选择它的复选框。
$('.cbOzelHastaAdi')**
$('.cbOzelHastaAdi')**
Which returns a result set. Therefor, checking if it is checked is invalid, because their might be multiple checkboxes... I know he's using the thiskeyword in his code, but for me this also did not fix the problem.
它返回一个结果集。因此，检查它是否被选中是无效的，因为它们可能是多个复选框......我知道他在他的代码中使用了this关键字，但对我来说这也没有解决问题。
As soon as you select the checkbox by ID, you can evaluate its 'checked' attribute.
只要您按 ID 选中复选框，就可以评估其“已检查”属性。
回答by user2717833
This is also working:
这也有效：
(($('input[name="myCheckBox"]:checked').val())=='on')
It will return either true or false
它将返回 true 或 false
where the checkbox is defined as:
其中复选框定义为：
<input type="checkbox" name="myCheckBox">
回答by Zhaph - Ben Duguid
I've found that the following is probably the best way to determine checked status in jQuery:
我发现以下可能是确定 jQuery 中已检查状态的最佳方法：
var cbs = $(parentDiv).find('table input:checkbox:checked');
This will give you an array of each input that has been checked.
这将为您提供已检查的每个输入的数组。
This is mostly from the jQuery docs:
这主要来自 jQuery 文档：
回答by Ben Koehler
Russ Cam's answer works, but why not jQueryify it some more?
Russ Cam 的回答有效，但为什么不对其进行更多的 jQueryify？
$(function() {
$('.cbOzelHastaAdi').live('click', function() {
$(this).parents('div').find('table input:checkbox').attr('checked', $(this).attr('checked'));
});
});
This assumes that the class cbOzelHastaAdiis now attached to the checkbox instead of the span element. This should allow you to avoid all of the messy ASP renaming and allow multiple similar tables per page without the need for multiple click event functions.
这假设类cbOzelHastaAdi现在附加到复选框而不是 span 元素。这应该允许您避免所有凌乱的 ASP 重命名，并允许每页有多个相似的表，而无需多个单击事件功能。
回答by Ben Koehler
=== is a type safe comparator for JS
=== 是 JS 的类型安全比较器
See: https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Operators/Comparison_Operators
请参阅：https: //developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Operators/Comparison_Operators
