Question

写这个函数有没有更有效的方法？

$('input').change(function() {

    if($("#m1, #m2, #m3, #m4, #m5").is(":checked")){

    // do something
    }

    else if($("#m1, #m2, #m3, #m4, #m5").is(":not(:checked)")){

    // do something

    }

}

Answer 1

不需要else if，只需要if/else即可：

$('input').change(function() {
    if($("#m1, #m2, #m3, #m4, #m5").is(":checked")){
        // do something
    } else {
        // do something
    }
}

您还可以为元素添加一个类，以缩短选择器：

$('input').change(function() {
    if($(".radios").is(":checked")){
        // do something
    } else {
        // do something
    }
}

另一种方法，如果你的if/else块都有很多行代码，你可以将它们移动到命名函数并使用三元运算符：

$('input').change(function() {
    return $("#m1, #m2, #m3, #m4, #m5").is(":checked") ? funcForChecked() : funcForUnchecked();
}

Answer 2

Inside Events Listeners你有this对象代表触发事件的元素，所以你可以写：

$('input').change(function() {

    if($(this).is(":checked")){
        // do something

       return;
    }

    // do something        
}

Answer 3

您可以使用类别“复选框”标记它们而不是引用所有那些I.D，并使用以下

if($('.checkbox:checked').length == $('.checkbox').length){ blah blah } ;

请参阅此小提琴https://jsfiddle.net/hyopdt3v/

Answer 4

我假设你有像

这样的东西

RoomEquipment

在这种情况下，您可以将组包装到具有自己的id：

的div中

<input id="m1" type="radio" name="groupName" />
...
<input id="m5" type="radio" name="groupName" />

并将change事件绑定到：

<div id="m15">
</div>

或者你可以更具体地使用类：

$('#m15').change(function() {
    if ($(this).find('input').is(":checked")) {
        // do something
    }
}

由于它们是单选按钮，因此未选中任何一个，或仅选中一个。

出于同样的原因，这可行：

<div id="m15">
    ...
    <input id="m1" class="m15" />
</div>

$('#m15').change(function() {
    if ($(this).find('input.m15').is(":checked")) {
        // do something
    }
}

您当前的代码绑定到所有 $('#m15 input.m15').change(function() { // Triggered the first time - and all subsequent times });元素，这意味着即使更改了其他控件，它也会触发;在我看来，这是不良行为。

有关这两个代码，请参阅this fiddle。

有没有更有效的方式来编写这个函数？

4 个答案: