簡體   English   中英

檢查一組復選框,是否在Bootstrap中選中了一個復選框。

[英]Checking a set of checkbox if a checkbox is checked in Bootstrap or not.

您好,在bootstrap 3中執行此操作時遇到問題。我的代碼在jsfiddle中工作,但是在bootstrap中不起作用。

這是jsfiddle

HTML

<div class="col-md-3 span6 privilege-container-b">
<label class="checkbox">
    <input type="checkbox" name="mypriv" value="test_priv1" class="test_priv1">Checkbox 1</label>
<label class="checkbox">
    <input type="checkbox" name="mypriv" value="test_priv2" class="test_priv2">Checkbox 2</label>
<label class="checkbox">
    <input type="checkbox" name="mypriv" value="test_priv3" class="test_priv3">Checkbox 3</label>
<label class="checkbox">
    <input type="checkbox" name="mypriv" value="test_priv4" class="test_priv4">Checkbox 4</label>
<label class="checkbox">
    <input type="checkbox" name="mypriv" value="test_priv5" class="test_priv5">Checkbox 5</label>
<label class="checkbox">
    <input type="checkbox" name="mypriv" value="test_priv6" class="test_priv6">Checkbox 6</label>
</div>

jQuery的

$('.test_priv1').change(function () {
    var val = $('.test_priv1').is(':checked');
    if (val === true) {
        $('.test_priv2, test_priv3').prop('checked', true);
        $('.test_priv2, test_priv3').prop('disabled', true);
    } else {
        $('.test_priv2, test_priv3').prop('checked', false);
        $('.test_priv2, test_priv3').prop('disabled', false);
    }
    return false;
});

上面的代碼不起作用。 我的目標是如果選中了test_priv1,則將檢查並鎖定test_priv2和test_priv3。 我的代碼有什么問題嗎? 請糾正我。 謝謝

我將點添加到text_priv3選擇器並執行

現場演示

$(function() {
    $('.test_priv1').on("click", function () { // IE<9 triggers change after blurred
        var checked = $(this).is(':checked');
        var $otherChecks = $('.test_priv2, .test_priv3');
        $otherChecks.prop('checked', checked);
        $otherChecks.prop('disabled', checked);
        $otherChecks.parent().toggleClass("disabled",checked);
    });
});

注意我也將標簽文本設為灰色

順便說一句,如果您想將所有其他框都塗成灰色,則無論班級如何,都可以

var $otherChecks = $("input[name='mypriv']:not('.test_priv1')");

要么

var $otherChecks = $("input[name='mypriv']").not(this);

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM