如何使用jQuery Uniform库取消选中复选框

时间:2011-02-14 20:35:35

标签: jquery checkbox

我在取消选中checkbox时遇到问题。看看我正在尝试的my jsFiddle

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

我使用uniform来设置checkbox的样式,但它不能用于选中/取消选中 checkbox

有什么想法吗?

12 个答案:

答案 0 :(得分:368)

更简单的解决方案是执行此操作而不是使用统一:

$('#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()复选框已检查值

答案 1 :(得分:108)

查看他们的文档,他们有一个$.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);
});

答案 2 :(得分:24)

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

这对我有用,这将取消选中复选框。 以同样的方式我们可以使用

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

选中复选框。

答案 3 :(得分:13)

如果您正在使用uniform 1.5,请使用此简单技巧添加或删除检查属性。只需在复选框的输入字段中添加value =“check”。
在{中添加此代码{1}}> uniform.js> function doCheckbox(elem){

.click(function(){

如果您不想在输入框中添加value =“check”,因为在某些情况下您添加了两个复选框,因此请使用此

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

如果您使用uniform 2.0,请使用此简单技巧在此if ($(elem).is(':checked')) { $(elem).attr('checked','checked'); } else { $(elem).removeAttr('checked'); } 功能更改中添加或删除支票的属性

classUpdateChecked($tag, $el, options) {

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

答案 4 :(得分:7)

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

这对我有用。

答案 5 :(得分:2)

这样做:

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

答案 6 :(得分:1)

如果您使用文档中提到的javascript更新元素,则需要调用$.uniform.update()

答案 7 :(得分:1)

首先,checked的值可以为checked,或者为空字符串。

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

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

答案 8 :(得分:1)

在某些情况下,您可以使用:

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

对于切换,你可以使用if else with function

答案 9 :(得分: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/>

答案 10 :(得分:0)

另一种方法是,

使用$('#check2').click();

这导致统一检查复选框并更新它的掩码

答案 11 :(得分:-1)

复选框,其作用类似于radio btn

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