当前位置 : 主页 > 网页制作 > JQuery >

jquery – 检查完所有复选框后发出警报

来源:互联网 收集:自由互联 发布时间:2021-06-15
我到处寻找(但也许我错过了什么) 我目前正在创建一个人们有3种选择的网站. 让我们轻松一点,1,2和3. 现在,客户需要一种技术,在您单击第三个复选框后(无论以哪种方式,您可以从1到3然后
我到处寻找(但也许我错过了什么)

我目前正在创建一个人们有3种选择的网站.

让我们轻松一点,1,2和3.

现在,客户需要一种技术,在您单击第三个复选框后(无论以哪种方式,您可以从1到3然后是2,或3,1然后2)都会出现警报弹出窗口.

现在我到处都看,但我找不到它.
希望有人可以帮助我.

Thanx已经.

这应该有用,我想:

$('input:checkbox').change(
    function(){
        if ($('input:checkbox:checked').length == $('input:checkbox').length){
            alert('All checkboxes are checked!');
        }
    });

JS Fiddle demo.

编辑以回应mblase75的(准确)评论(如下):

Of course this won’t work if there are ANY other checkboxes on the page, but that can easily be solved by adding a class to the three checkboxes being monitored and selecting that instead.

上述内容可以很容易地适用于单个元素的子元素,无论页面上有多少元素:

$('input:checkbox').change(

function() {
    var $formElement = $(this).closest('form');
    if($formElement.find('input:checkbox:checked').length == $formElement.find('input:checkbox').length) {
        alert('All checkboxes are checked!');
    }
});

JS Fiddle demo.

修改$formElement = $(this).closest(‘form’);用于选择另一个元素,div,fieldset或任何其他元素的变量赋值将允许您仅定位该给定元素中的那些复选框.

参考文献:

> :checkbox selector
> change()
> :checked selector
> length
> closest()
> find()

网友评论