Question

我正在尝试使用jquery编写一个javascript，它应该能够选中并使用有关是否选中复选框的信息。每次单击复选框（具有id'edit-toggle-me'）时都会发生这种情况。我已经为此编写了一个测试函数，其中包含一些alert（）以查看我是否成功。

(function ($) {
    "use strict";
    $(document).ready(function () {

        $('#edit-toggle-me').click(function(){

            if ($('#edit-toggle-me').checked()) {
                alert('Yup!');
            }
            else {
            alert('Nup!');
            }


        });
    });

})(jQuery);

它没有执行任何警报，所以我猜它崩溃在$（'＃edit-toggle-me'）。checked（）。我不知道为什么。

我也试过这个：

(function ($) {

    $(document).ready(function () {

        $('#edit-toggle-me').click(function(){
            var elementy = document.getElementById('edit-toggle-me');
            var check = elementy.value;
            alert(check);
            if(elementy.checked()) {
                alert('yup');
            }
        });
    });
})(jQuery);

第一个警报有效，但两个都没有，或者最后两个'是'或'nup'。

然后我也尝试了这个：

(function ($) {

     $(document).ready(function () {

        $('#edit-toggle-me').click(function(){

            var element2 = document.getElementById('edit-toggle-me');
            var check = element2.value;
            alert(check);

        });
    });
   })(jQuery);

这总是返回1.我不明白为什么。

感谢任何提示。

Answer 1

使用.is(':checked')。您可以找到文档HERE。

JSFIDDLE

Answer 2

jQuery或DOM API中没有.checked()这样的方法。如果选中该元素，则元素上只有.checked属性为true，否则为false。试试这个：

(function ($) {
    "use strict";
    $(document).ready(function () {

        $('#edit-toggle-me').click(function(){
            alert( this.checked ? ":)" : ":(" );
        });
    });

})(jQuery);

请参阅演示：http://jsfiddle.net/scZ3X/

Answer 3

$(function(){
    $('#edit-toggle-me').on('change', function(){
        if($(this).is(':checked')) {
            alert('checked');
        }
        else {
            alert('unchecked');
        }
    });
});

您必须使用 change 事件 而不是点击。因为在某些情况下，单击事件不适合在复选框和单选按钮中使用。

示例1：

如果您有单选按钮，则单击事件绑定。如果您的单选按钮已经为真，并且单击单选按钮。它不会改变单选按钮值，但每次点击事件都会触发。

但是如果您使用更改事件。只有当你的单选按钮值发生变化时才会触发你的事件（如果它已经未被检查或是真的）

示例2： 如果您有任何单选按钮或复选框的标签。如果您在复选框或单选按钮中有click事件绑定。点击标签后，您的复选框或单选按钮值会发生变化，但您的点击事件不会调用。

如果发生变更事件。它也会在点击标签相关标签时按预期工作。

Answer 4

试试这个：

$('#edit-toggle-me').is(':checked')

使用javascript获取复选框的状态

4 个答案: