使用 javascript 获取复选框的状态

Get state of checkbox using javascript

本文关键字：状态 复选框 获取 javascript 使用      更新时间：2023-09-26

我正在尝试用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);
第一个警报有效，但两个警报都不起作用

，最后两个警报都不起作用。

然后我也尝试了这个：

(function ($) {
     $(document).ready(function () {
        $('#edit-toggle-me').click(function(){
            var element2 = document.getElementById('edit-toggle-me');
            var check = element2.value;
            alert(check);
        });
    });
   })(jQuery);

这始终返回 1。我也不明白为什么。

感谢任何提示。

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

吉斯菲德尔

在 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/

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

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

示例 1：

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

但以防万一，如果您使用更改事件。仅当单选按钮值发生更改时，才会触发事件（如果尚未选中或为 true）

示例 2：如果您有任何单选按钮或复选框的任何标签。如果您有单击事件绑定复选框或单选按钮。单击标签时，复选框或单选按钮值已更改，但单击事件不会调用。

在发生变更事件时。它也将在单击标签相关标签时按预期工作。

试试这个：

$('#edit-toggle-me').is(':checked')
相关文章：