JQuery Uniform kitaplığını kullanarak onay kutusunun işareti nasıl kaldırılır

144

A işaretini kaldırmakla ilgili bir sorunum var checkbox. Denediğim jsFiddle'ıma bir göz atın :

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

Kullandığım üniforma stil için checkboxve basitçe için çalışmıyor / işaretini kaldırın kontrolcheckbox .

Herhangi bir fikir?

jquery checkbox

— Olumlu oy
kaynak

hem google

— chrome'da

108

Dokümanlarına bakıldığında, $.uniform.update"tek tip" bir öğeyi yenileme özelliği var .

Örnek: http://jsfiddle.net/r87NH/4/

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

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

— user113716
kaynak

5

@mkoryak: İçinde iyi çalışıyor 1.4.4, ancak js ve css dosyalarına bağlantılar koptu. İşte güncellenmiş bir keman. Özellikle içinde sorunları olacağını kastediyorsanız, 1.6jQuery değiştiğinden sonra davranışını geri aldığından bu muhtemelen doğrudur .attr(). Kullanarak 1.6veya daha yüksek, gerçekten kullanmalısınız .prop().

— user113716

Güncellenen jsFiddle ile orijinal arasında (2 numaralı onay kutusunun yanlış etiketlenmesine kadar) kesinlikle hiçbir fark göremiyorum, ancak güncellenmiş sürüm benim için çalışıyor ve orijinal değil!?!?

— iPadDeveloper2011

BTW'nin tüm bu pikselle çizilmiş Üniforma formları Retina'da hiç seksi görünmüyor .

— BorisOkunskiy

benim için işe yaramadı da jsfiddle çalışmıyor veya kafa karıştırıcı

— matthy

367

Tek tip kullanmak yerine bunu yapmak daha basit bir çözümdür:

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

Bu, tanımlanan herhangi bir tıklama eylemini tetiklemeyecektir.

Ayrıca kullanabilirsin:

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

Bu, onay kutusu için onaylama / işareti kaldırmayı değiştirir, ancak bu aynı zamanda tanımladığınız herhangi bir tıklama eylemini de tetikler. Yani dikkatli ol.

DÜZENLEME : jQuery 1.6+ kullanımları prop()değil attr()işaret kutusu değerini kontrol

— Bay Hunt
kaynak

2

Bu, kontrol edilen özniteliği benim için jQuery 1.7.1'de olduğu gibi bırakır. Çalışır ama yapacağını düşündüğün şeyi yapmaz.

— 2rs2ts

24

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

Bu benim için çalıştı, bu onay kutusunun işaretini kaldıracak. Aynı şekilde kullanabiliriz

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

onay kutusunu işaretlemek için.

— kullanıcı1683014
kaynak

4

.Attr () yerine .prop () işlevini kullanmanın daha iyi olacağını düşünüyorum. Aksi takdirde, her zaman beklendiği gibi çalışmayacaktır ...

— Simon Steinberger

13

Tek tip 1.5 kullanıyorsanız , check özniteliğini eklemek veya kaldırmak için bu basit numarayı kullanın
Sadece onay kutunuzun giriş alanına value = "check" ekleyin.
Bu kodu ekle uniform.js> function doCheckbox(elem){>.click(function(){

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

Bazı durumlarda iki onay kutusu eklediğiniz için giriş kutunuza value = "check" eklemek istemiyorsanız, bunu kullanın

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

Tek tip 2.0 kullanıyorsanız
, bu classUpdateChecked($tag, $el, options) {işlev değişikliğinde kontrol özniteliğini eklemek veya kaldırmak için bu basit numarayı kullanın.

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

İçin

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

}

— Sohail Ahmed
kaynak

7

$('#check1').prop('checked', true).uniform(); 
$('#check1').prop('checked', false).uniform();

Bu benim için çalıştı.

— Parijat
kaynak

Çok teşekkür ederim. Bunun en basit çözüm olduğunu doğrulayabilirim.

— Rudolph Opperman

2

Sadece şunu yap:

$('#checkbox').prop('checked',true).uniform('refresh');

— Moledet
kaynak

1

$.uniform.update()Dokümantasyonda belirtildiği gibi javascript kullanarak öğeyi güncellerseniz aramanız gerekir .

— Adeel
kaynak

1

Her şeyden önce, checkedbir değeri checkedveya boş bir dizge olabilir.

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

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

— nyuszika7h
kaynak

Değeri olarak bir boole geçmekte yanlış bir şey yoktur checked.

— user113716

Ancak HTML işaretlemesi yazmıyoruz. Üzerinde bir mülk ayarlıyoruz HTMLInputElement. checkedMülke bir göz atın .

— user113716

Boşver… Neden geçersiz olduğunu gerçekten anlamıyorum…

— nyuszika7h

Bir boole değerinin geçirilmesi yalnızca 1.6+ sürümünde desteklenir, bundan önce işaretli özelliği "işaretli" olarak ayarlamanız veya kaldırmanız gerekir.

— mkoryak

1

Bazı durumlarda bunu kullanabilirsiniz:

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

Geçiş yapmak için eğer işlevli başka bir şey kullanabilirsiniz

— Larionov Nikita
kaynak

1

 $("#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/>

Snippet'i genişlet

— P.Mondal
kaynak

0

Diğer bir yol da

kullanım $('#check2').click();

bu, üniformanın onay kutusunu işaretlemesine ve maskelerini güncellemesine neden olur

— Hailwood
kaynak

-1

radyo btn gibi davranan onay kutusu

$(".checkgroup").live('change',function() { var previous=this.checked; $(".checkgroup).attr("checked", false); $(this).attr("checked", previous); });

— RaDo
kaynak