Question

我有这段代码，

Function Alt(Soc1 As Double)
Static D As Integer

If Soc1 >= 40 Then
    D = 0
ElseIf Soc1 <= 30 Then
    D = 1
End If
Alt = D

来源是全选的复选框。 className是需要更改的复选框的类名。 for循环是一个循环，用于更改复选框状态，该状态取决于＆＃34; Select All＆＃34;州。我还添加了.change事件，它将改变＆＃34; Select All＆＃34;复选框状态更改时的状态。

这段代码正常运行，但我的问题是，我想让这段代码变小。是否可以缩小此代码？

Answer 1

这太长了：

checkboxes = document.getElementsByClassName(className);
for(var i=0, n=checkboxes.length;i<n;i++) {
   checkboxes[i].checked = source.checked;
 }

使用jquery，可以是：

$(classname).prop('checked', source.checked);

我不太明白为什么你的.change函数在checkBoxToggle函数中。我认为这是一个错误。

Answer 2

看看这个JSFiddle。

我创建了一个简单的表单（在小提琴中有两个）

<form>
    <label for="checkbox-all">Select All</label>
    <input id="checkbox-all" class="check-all" type="checkbox" />

    <label for="checkbox-01">01</label>
    <input id="checkbox-01" class="checkbox" type="checkbox" />

    <label for="checkbox-02">02</label>
    <input id="checkbox-02" class="" type="checkbox" />

    <label for="checkbox-03">03</label>
    <input id="checkbox-03" class="" type="checkbox" />

    <label for="checkbox-04">04</label>
    <input id="checkbox-04" class="checkbox" type="checkbox" />

    <label for="checkbox-05">05</label>
    <input id="checkbox-05" class="checkbox" type="checkbox" />
</form>

然后是一些jQuery：

<script>

function checkAll(element, className) {

    var checkboxesToChange = typeof(className) === 'undefined' || className === ''  ? 'input[type="checkbox"]' : '.'+className;

    var $form = $(element).closest('form');
    var $checkboxes = $form.find(checkboxesToChange);

    if($(element).is(':checked')){
        $checkboxes.prop('checked', true);
    }else{
        $checkboxes.prop('checked', false);
    }

}

$('.check-all').on('change', function(){
    checkAll(this);
    //checkAll(this, 'checkboxes'); 
})

</script>

如果您想要选择所有可以切换的选项，那么这样就可以了。它还接受第二个参数，它只会在您指定的类的复选框上打开和关闭。

希望这有助于，或至少提供一些有关如何减少代码的见解。

使用jquery切换复选框

2 个答案: