Установите и снимите флажок с помощью jquery

Question

Я хотел бы создать функцию для проверки и снятия флажков, когда мы нажимаем на предыдущий элемент span, он работает один раз, но он не работает во второй раз ... Я не делаю «т понять ...

Мой HTML-код:

<form class="form" action="#" method="post"> 
    <label>Input radio</label> 
    <span>Text</span><input type="checkbox"> 
    <span>Text</span><input type="checkbox"> 
    <span>Text</span><input type="checkbox"> 
    <label>Input checkbox</label> 
    <span>Text</span><input type="radio" name="radio"> 
    <span>Text</span><input type="radio" name="radio"> 
</form> 

Мой код расслоение плотной:

$('form.form').find('span').on('click', function(){ 
    $this = $(this); 
    if($(this).next().attr('type') == 'checkbox'){ 
     if($this.next().is(':checked')){ 
      $this.next().attr('checked', false); 
     }else{ 
      $this.next().attr('checked', true); 
     } 
    }else{ 
     $this.next().attr('checked', true); 
    } 
}); 

Update 1

URL: http://jsfiddle.net/tonymx227/bvPsq/

Энтони

Answer 1

Вы должны использовать prop() для этого

$this.next().prop('checked', false); 

Причина он работает в первый раз, это потому, что JQuery изменяет атрибут, и флажок обновляется , но свойство checked элемента не обновляется и что он был встроен в jQuery, чтобы проверить, установлен ли флажок, поэтому в следующий раз, когда вы попытаетесь его изменить, att ribute говорит, что он проверен, и флажок, по-видимому, проверен, но jQuery считает, что он не проверен, так как это свойство говорит, поскольку оно не было установлено с attr().

FIDDLE

Answer 2

Здесь вы можете использовать ярлык, обернуть входы с этикеткой. Для этого вам не обязательно использовать Javascript.

<label>Text<input type="checkbox" /></label> 

или вы можете использовать label for, если у вас есть флажки с идентификатором, связанным с ним.

<label for="chk1">Text</label> <input type="checkbox" id="chk1" /> 

Demo

HTML-элемент представляет собой заголовок для элемента в пользовательском интерфейсе. Он может быть связан с элементом управления либо с помощью атрибута for, либо путем размещения элемента управления внутри элемента метки. Такой контроль называется помеченным элементом управления элементом метки.