отметьте все / снимите все флажки, используя jquery

Question

Итак, я хотел создать главный флажок, который бы выбирал все и снимал все флажки. Я нашел этот фрагмент jquery, который работал лучше, чем то, что я создал.

$("#checkboxSort").live( 'change', function() {
  $(".apply-single").attr( 'checked', $( this ).is( ':checked' ) ? 'checked' : '' );
});

У меня вопрос: что именно говорит этот раздел:

$( this ).is( ':checked' ) ? 'checked' : '' 

Я понимаю, что "this" является ".apply-single" и что он проверяет, "проверен" ли он, но что означает остальная часть раздела ... на английском? У меня есть мысли о том, что это значит, но я скорее слышу то, что кто-то знает, чем я думаю.

Спасибо, кто может помочь.

Answer 1

Я понимаю, что "this" - это ".apply-single"

Нет.this фактически ссылается на элемент #checkboxSort.

? - это условный оператор в JavaScript.

Конкретный фрагмент кода, о котором вы спрашиваетеозначает (псевдокод):

if the element with ID "checkboxSort" is checked:
    check all elements with class "apply-single"
else:
    uncheck all elements with class "apply-single"

Короче говоря, весь фрагмент кода делает это:

Прослушивает изменения в элементе с идентификатором checkboxSort.Когда происходит событие change, установите состояние checked всех элементов класса apply-single на новое состояние checked элемента #checkboxSort.

---

БесстыдныйСамореклама: я сделал маленький плагин jQuery, чтобы справиться с этим. Проверьте это .

Answer 2

Это называется троичный оператор .Общий формат:

[boolean expression] ? [expression A] : [expression B]

. Он оценивается как выражение A, если логическое выражение оценивается как true, и как выражение B, если логическое выражение оценивается как false.

.

Answer 3

this на самом деле #checkboxSort контекст , а не .apply-single. Таким образом, он устанавливает все .apply-single для отмеченного атрибута #checkboxSort.

Это троичный оператор . Похоже на оператор if, просто встроенный.

Answer 4

.live () устарела.Вместо этого используйте .on ().

Проверьте это: http://jsfiddle.net/loginet/Rdc5r/

$(document).ready(function () {

    $("#checkboxSort").on('click', function () {
        $(".apply-single").prop("checked", $("#checkboxSort").prop("checked"));
    });

    $('.apply-single').on('click', function () {
        var total = $('input:not(#checkboxSort)').length;
        var checked = $('input:not(#checkboxSort):checked').length;         
        if (total == checked) {
            $('#checkboxSort').prop('checked', true);
        } else if (total > checked || checked == 0) {
            $('#checkboxSort').prop('checked', false);
        } 
    });    
});

и HTML:

<p>
    <input type="checkbox" id="checkboxSort" />Check/Uncheck All</p>
<hr/>
<p id="p">
    <input type="checkbox" class="apply-single" />Checkbox 1
    <input type="checkbox" class="apply-single" />Checkbox 2
    <input type="checkbox" class="apply-single" />Checkbox 3
</p>

Answer 5

На английском языке код, о котором вы спрашиваете, говорит, что если этот элемент отмечен, то установите атрибут «checked» всех элементов HTML, имеющих класс CSS «apply-single», на «флажок» - если нет затем установите пустое значение.

Но, пожалуйста, подтвердите, что фактический результат не приводит к атрибутам, где флажок = "".

Для флажков непроверенное состояние не выражается с помощью зарегистрированного = "", скорее оно выражается в том, что вообще не имеет проверенного атрибута.

Answer 6

В этой строке используется троичный оператор, который работает следующим образом:

  <condition>?<consequent>:<alternative>

Так что $( this ).is( ':checked' - это ваше условие, которое возвращает true или false в зависимости от того, установлен флажок или нет.Если это правда, тогда «отмечено» становится атрибутом, в противном случае «становится атрибутом.

Answer 7

Это сокращение для

if($(".apply-single").is(':checked')) {
    $(".apply-single").attr("checked", "checked");
} else {
     $(".apply-single").attr("checked", "");
}