Як зняти прапорець за допомогою бібліотеки jQuery Uniform

144

У мене проблема з видаленням параметра a checkbox. Подивіться на мій jsFiddle , де я роблю спроби:

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

Я використовую форму для стилізації checkboxі він просто не працює , щоб перевірити / зніміть прапорецьcheckbox .

Будь-які ідеї?

jquery checkbox

— Оновлення
джерело

і в google chrome, і в firefox для мене це не працює

— Upvote

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);
});

— користувач113716
джерело

5

@mkoryak: Добре працює 1.4.4, але посилання на файли js та css були порушені. Ось оновлена загадка. Якщо ви маєте на увазі, що у нього будуть проблеми конкретно 1.6, то це, мабуть, правда, оскільки jQuery змінився, а потім відвернув поведінку .attr(). Використовуючи 1.6або вище, ви дійсно повинні користуватися .prop().

— користувач113716

Я бачу абсолютно ніякої різниці між оновленим jsFiddle та оригіналом (аж до неправильної позначки прапорця 2), за винятком того, що оновлена версія для мене працює, а оригінал не став!?!?

— iPadDeveloper2011

До речі, всі ці форми, намальовані пікселями, виглядають на сітківці дуже несексуально .

— втілився

не працював для мене також jsfiddle не працює або плутає

— матір

367

Більш просте рішення - це зробити, а не використовувати єдину форму:

$('#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()для встановлення прапорців встановлене значення

— Містер Гант
джерело

2

Це залишає перевірений атрибут як є в jQuery 1.7.1 для мене. Працює, але не робить те, що, на вашу думку, повинно.

— 2rs2ts

24

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

Це працювало для мене, це зніме прапорець. Таким же чином ми можемо використовувати

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

щоб встановити прапорець.

— користувач1683014
джерело

4

Я думаю, що краще використовувати функцію .prop () замість .attr (). Інакше це буде працювати не завжди так, як очікувалося ...

— Саймон Штейнбергер,

13

Якщо ви використовуєте рівномірний 1.5, використовуйте цей простий трюк, щоб додати або видалити атрибут чека.
Просто додайте значення = "перевірити" у полі введення вашого прапорця.
Додайте цей код в 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);
    }

}

— Сохайл Ахмед
джерело

7

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

Це працювало для мене.

— Паріят
джерело

Велике спасибі. Я можу підтвердити, що це найпростіше рішення.

— Рудольф Опперман

2

Просто зробіть це:

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

— моледець
джерело

1

Вам потрібно зателефонувати, $.uniform.update()якщо ви оновлюєте елемент за допомогою javascript, як зазначено в документації.

— Адель
джерело

1

Перш за все, checkedможе мати значення checkedабо порожній рядок.

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

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

— nyuszika7h
джерело

Немає нічого поганого в передачі булевого значення як значення checked.

— користувач113716

Але ми не пишемо розмітку HTML. Ми встановлюємо властивість на HTMLInputElement. Подивіться на checkedвласність.

— користувач113716

Не забувайте… Я теж не розумію, чому він недійсний…

— nyuszika7h

передача булевого значення підтримується лише у версії 1.6+, перед цим вам довелося встановити перевірений атрибут на "перевірено" або видалити його.

— mkoryak

1

У деяких випадках ви можете використовувати це:

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

Для перемикання ви можете використовувати якщо не функцію

— Ларіонов Микита
джерело

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/>

Розгорніть фрагмент

— П.Мондал
джерело

0

Інший спосіб - це

використання $('#check2').click();

це змушує рівномірно встановити прапорець і оновити його маски

— Гейлвуд
джерело

-1

прапорець, який діє як радіо btn

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

— RaDo
джерело