Установка "проверил" для флажка с JQuery? - PullRequest
3872 голосов
/ 09 января 2009

Я бы хотел сделать что-то подобное, чтобы отметить checkbox, используя jQuery :

$(".myCheckBox").checked(true);

или

$(".myCheckBox").selected(true);

Существует ли такая вещь?

Ответы [ 40 ]

41 голосов
/ 14 марта 2013

Чтобы установить флажок с помощью jQuery 1.6 или выше, просто сделайте это:

checkbox.prop('checked', true);

Чтобы снять отметку, используйте:

checkbox.prop('checked', false);

Вот что мне нравится использовать для переключения флажка с помощью jQuery:

checkbox.prop('checked', !checkbox.prop('checked'));

Если вы используете jQuery 1.5 или ниже:

checkbox.attr('checked', true);

Чтобы снять отметку, используйте:

checkbox.attr('checked', false);
36 голосов
/ 23 октября 2012

Вот способ сделать это без jQuery

function addOrAttachListener(el, type, listener, useCapture) {
  if (el.addEventListener) {
    el.addEventListener(type, listener, useCapture);
  } else if (el.attachEvent) {
    el.attachEvent("on" + type, listener);
  }
};

addOrAttachListener(window, "load", function() {
  var cbElem = document.getElementById("cb");
  var rcbElem = document.getElementById("rcb");
  addOrAttachListener(cbElem, "click", function() {
    rcbElem.checked = cbElem.checked;
  }, false);
}, false);
<label>Click Me!
  <input id="cb" type="checkbox" />
</label>
<label>Reflection:
  <input id="rcb" type="checkbox" />
</label>
30 голосов
/ 10 сентября 2012

Попробуйте это:

$('#checkboxid').get(0).checked = true;  //For checking

$('#checkboxid').get(0).checked = false; //For unchecking
29 голосов
/ 25 октября 2011

Вот код для проверки и снятия отметки кнопкой:

var set=1;
var unset=0;
jQuery( function() {
    $( '.checkAll' ).live('click', function() {
        $( '.cb-element' ).each(function () {
            if(set==1){ $( '.cb-element' ).attr('checked', true) unset=0; }
            if(set==0){ $( '.cb-element' ).attr('checked', false); unset=1; }
        });
        set=unset;
    });
});

Обновление: здесь тот же блок кода с использованием более нового метода Jquery 1.6+ prop, который заменяет attr:

var set=1;
var unset=0;
jQuery( function() {
    $( '.checkAll' ).live('click', function() {
        $( '.cb-element' ).each(function () {
            if(set==1){ $( '.cb-element' ).prop('checked', true) unset=0; }
            if(set==0){ $( '.cb-element' ).prop('checked', false); unset=1; }
        });
        set=unset;
    });
});
27 голосов
/ 24 июня 2011

Мы можем использовать elementObject с jQuery для проверки атрибута:

$(objectElement).attr('checked');

Мы можем использовать это для всех версий jQuery без ошибок.

Обновление: Jquery 1.6+ имеет новый метод поддержки, который заменяет attr, например:

$(objectElement).prop('checked');
25 голосов
/ 17 апреля 2012

Если вы используете PhoneGap при разработке приложения, и у вас есть значение на кнопке, которое вы хотите отобразить мгновенно, не забудьте сделать это

$('span.ui-[controlname]',$('[id]')).text("the value");

Я обнаружил, что без диапазона интерфейс не будет обновляться независимо от того, что вы делаете.

24 голосов
/ 16 августа 2013

Вот код и демонстрация того, как установить несколько флажков ...

http://jsfiddle.net/tamilmani/z8TTt/

$("#check").on("click", function () {

    var chk = document.getElementById('check').checked;
    var arr = document.getElementsByTagName("input");

    if (chk) {
        for (var i in arr) {
            if (arr[i].name == 'check') arr[i].checked = true;
        }
    } else {
        for (var i in arr) {
            if (arr[i].name == 'check') arr[i].checked = false;
        }
    }
});
20 голосов
/ 12 октября 2013

Другое возможное решение:

    var c = $("#checkboxid");
    if (c.is(":checked")) {
         $('#checkboxid').prop('checked', false);
    } else {
         $('#checkboxid').prop('checked', true);
    }
18 голосов
/ 11 января 2013

Если вы используете мобильный телефон, и вы хотите, чтобы интерфейс обновлялся и показывал флажок как непроверенный, используйте следующее:

$("#checkbox1").prop('checked', false).checkboxradio("refresh");
18 голосов
/ 22 мая 2013

Обратите внимание на утечки памяти в Internet Explorer до Internet Explorer 9 , поскольку в документации jQuery указано :

В Internet Explorer до версии 9 с помощью .prop () установить DOM свойство элемента к чему-либо, кроме простого примитивного значения (число, строка или логическое значение) может вызвать утечку памяти, если свойство не удаляется (используя .removeProp ()) до удаления элемента DOM из документа. Для безопасной установки значений на объектах DOM без памяти утечки, используйте .data ().

...