web-dev-qa-db-ja.com

jQuery Uniformライブラリを使用してチェックボックスをオフにする方法

checkboxのチェックを外すと問題があります。 my jsFiddle を見てみましょう。

   $("#check2").attr("checked", true);

checkboxのスタイルに niform を使用していますが、checkboxをcheck/uncheckするようには動作しません。

何か案は？

jquerycheckbox
144
Artjom Zabelin

彼らのドキュメントを見ると、彼らは "制服"要素を更新するための$.uniform.update機能を持っています。

例：http://jsfiddle.net/r87NH/4/

$("input:checkbox").uniform();

$("body").on("click", "#check1", function () {
    var two = $("#check2").attr("checked", this.checked);
    $.uniform.update(two);
});
108
user113716

もっと簡単な解決策は、uniformを使うよりもむしろこれをすることです：

$('#check1').prop('checked', true); // will check the checkbox with id check1
$('#check1').prop('checked', false); // will uncheck the checkbox with id check1

これにより、定義されたクリックアクションはトリガーされません。

また使用することができます：

$('#check1').click(); //

これでチェックボックスのチェック/チェック解除が切り替わりますが、定義したクリックアクションもトリガーされます。ので注意してください。

EDIT：jQuery 1.6以降では、チェックボックスのチェック値にprop()ではなくattr()を使用します。

368
Mr.Hunt
$("#chkBox").attr('checked', false);

これは私のために働きました、これはチェックボックスのチェックを外します。私達が使用できるのと同じ方法で

$("#chkBox").attr('checked', true);

チェックボックスをチェックします。

24
user1683014

あなたが niform 1.5 を使っているのなら、この単純なトリックを使ってcheckの属性を追加または削除してください。
チェックボックスの入力フィールドにvalue = "check"を追加するだけです。
このコードをuniform.js> function doCheckbox(elem){> .click(function(){に追加してください。

if ( $(elem+':checked').val() == 'check' ) {
    $(elem).attr('checked','checked');           
}
else {
    $(elem).removeAttr('checked');
}

場合によっては2つのチェックボックスを追加するので、入力ボックスにvalue = "check"を追加したくない場合はこれを使用します。

if ($(elem).is(':checked')) {
 $(elem).attr('checked','checked');
}    
else
{    
 $(elem).removeAttr('checked');
}

niform 2. を使用している場合は、この単純なトリックを使用してcheckの属性を追加または削除します。
このclassUpdateChecked($tag, $el, options) {関数の変更

if ($el.prop) {
    // jQuery 1.6+
    $el.prop(c, isChecked);
}

に

if ($el.prop) {
    // jQuery 1.6+
    $el.prop(c, isChecked);
    if (isChecked) {
        $el.attr(c, c);
    } else {
        $el.removeAttr(c);
    }

}
13
Sohail Ahmed
$('#check1').prop('checked', true).uniform(); 
$('#check1').prop('checked', false).uniform();

これは私のために働きました。

7
Parijat

これをしてください。

$('#checkbox').prop('checked',true).uniform('refresh');
2
moledet
 $("#checkall").change(function () {
            var checked = $(this).is(':checked');
            if (checked) {
                $(".custom-checkbox").each(function () {
                    $(this).prop("checked", true).uniform();
                });
            } else {
                $(".custom-checkbox").each(function () {
                    $(this).prop("checked", false).uniform();
                });
            }
        });

        // Changing state of CheckAll custom-checkbox
        $(".custom-checkbox").click(function () {
            if ($(".custom-checkbox").length == $(".custom-checkbox:checked").length) {
                $("#chk-all").prop("checked", true).uniform();
            } else {
                $("#chk-all").removeAttr("checked").uniform();
            }
        });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id='checkall' /> Select All<br/>
 <input type="checkbox" class='custom-checkbox' name="languages" value="PHP"> PHP<br/>
 <input type="checkbox" class='custom-checkbox' name="languages" value="AngularJS"> AngularJS<br/>
 <input type="checkbox" class='custom-checkbox' name="languages" value="Python"> Python<br/>
 <input type="checkbox" class='custom-checkbox' name="languages" value="Java"> Java<br/>
1
P.Mondal

場合によってはこれを使用できます。

$('.myInput').get(0).checked = true

トグルのためにあなたは他の関数ならifを使うことができます

1
Larionov Nikita

ドキュメントに記載されているようにjavascriptを使用して要素を更新する場合は$.uniform.update()を呼び出す必要があります。

1
Adeel

まず第一に、checkedはcheckedの値、または空の文字列を持つことができます。

$("input:checkbox").uniform();

$('#check1').live('click', function() {
    $('#check2').attr('checked', 'checked').uniform();
});
1
nyuszika7h

もう1つの方法は、

$('#check2').click();を使う

これにより、uniformはチェックボックスをチェックしてマスクを更新します。

0
Hailwood