IT story

jQuery Uniform 라이브러리를 사용하여 확인란을 선택 취소하는 방법

hot-time 2020. 6. 16. 08:06
반응형

jQuery Uniform 라이브러리를 사용하여 확인란을 선택 취소하는 방법


의 선택을 해제하는 데 문제가 checkbox있습니다. 내가 시도하고있는 jsFiddle을 살펴보십시오 .

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

내가 사용하는 유니폼을 스타일링을 위해 checkbox그것은 단순히 작동하지 않습니다 / 선택 해제 확인checkbox .

어떤 아이디어?


문서를 살펴보면 $.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);
});

더 간단한 해결책은 유니폼을 사용하는 대신 이것을 수행하는 것입니다.

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

이렇게하면 정의 된 클릭 동작이 트리거되지 않습니다.

다음을 사용할 수도 있습니다.

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

확인란의 체크 / 체크를 토글하지만 정의한 클릭 동작도 트리거합니다. 그러므로 조심 해주시길 바랍니다.

편집 : jQuery 1.6 이상은 확인란의 값을 선택 prop()하지 않습니다.attr()


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

이것은 나를 위해 일했으며 확인란의 선택을 취소합니다. 같은 방법으로 우리는 사용할 수 있습니다

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

확인란을 선택하십시오.


균일 한 1.5 를 사용하는 경우이 간단한 트릭을 사용 하여 확인 속성을 추가하거나 제거
하십시오. 확인란의 입력 필드에 value = "check"를 추가하십시오.
이 코드를 추가 uniform.js> function doCheckbox(elem){>.click(function(){

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

입력 상자에 value = "check"를 추가하지 않으려면 경우에 따라 두 개의 확인란을 추가하기 때문에 이것을 사용하십시오.

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

당신이 사용하는 경우 균일 2.0을 다음 추가 또는 검사의 속성을 제거하는 간단한 트릭을 사용하는
이의 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);
    }

}

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

이것은 나를 위해 일했습니다.


그냥 이렇게 :

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

you need to call $.uniform.update() if you update element using javascript as mentioned in the documentation.


First of all, checked can have a value of checked, or an empty string.

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

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

In some case you can use this:

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

For toggle you can use if else with function


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


The other way to do is is,

use $('#check2').click();

this causes uniform to check the checkbox and update it's masks


checkbox that act like radio btn

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

참고URL : https://stackoverflow.com/questions/4996953/how-to-uncheck-checkbox-using-jquery-uniform-library

반응형