jQuery Снять отметку со всех, кроме одного, когда определен один из них

Question

Вот моя проблема ... У меня есть страница, которая загружает список клиентов и нажимает там имя, появляется всплывающее окно, и вы можете определить, в какое время им разрешено логин, вот код html.

<form action="" method="post" name="access_hours"> 
<table width="100%"> 
<tr> 
<td colspan="5"> 
<input type="checkbox" id="all" name="107" /> Check/Uncheck all 
</td> 
</tr> 
<div id="check_107"> 
<tr> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="01" />1AM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="02" />&nbsp;2AM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="03" />&nbsp;3AM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="04" />&nbsp;4AM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="05" />&nbsp;5AM</td> 
</tr> 
<tr> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="06" />&nbsp;6AM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="07" />&nbsp;7AM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="08" />&nbsp;8AM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="09" />&nbsp;9AM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="10" />10AM</td> 
</tr> 
<tr> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="11" />11AM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="12" />12PM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="13" />&nbsp;1PM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="14" />&nbsp;2PM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="15" />&nbsp;3PM</td> 
</tr> 
<tr> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="16" />&nbsp;4PM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="17" />&nbsp;5PM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="18" />&nbsp;6PM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="19" />&nbsp;7PM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="20" />&nbsp;8PM</td> 
</tr> 
<tr> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="21" />&nbsp;9PM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="22" />10PM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="23" />11PM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="00" />12AM</td> 
<td><input type="checkbox" name="accesstimes[]" id="107" value="NONE" />NONE</td> 
<td>&nbsp;</td> 
</tr> 
</div> 
<td colspan="5"> 
<input type="hidden" name="id" value="107" /> 
<input type="submit" class="updatebutton" name="confirm" value="Update" /> 
</td></tr></table> 
</form> 
</div> 

Вопрос в том, есть около 10 комплектов этих блоков на странице в связи с JQuery всплывающее окно, и все они находятся под DIV с идентификатором является «check_ (idofblock)», которая не является проблема. У меня есть флажок/снять флажок, чтобы все поля работали. Теперь, что я не могу понять, как это сделать, когда я выбрал все флажки, если я нажму на тот, который помечен как «NONE», тогда это единственный выбранный, а также если выбрано NONE, как это сделать? снимите флажок после того, как я нажму на что-нибудь еще? Кажется, я просто не понимаю. Вот мой код для «check/uncheck all», который проверяет все, кроме NONE.

$('input[id=all]').click(function() { 
      the_id = $(this).attr('name'); 
      $('input:checkbox[id="'+the_id+'"]').attr('checked', ($(this).is(':checked'))); 
      $('input:checkbox[id="'+the_id+'"][value="NONE"]').attr('checked', false); 
    }); 

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

Любая помощь будет принята с благодарностью :)

Answer 1

не элегантное решение, но это работает, и как @ ridecar2, предлагаемый с использованием идентичных идентификаторов, не является хорошей практикой/следует избегать

$('input[id=all]').click(function() {   
    the_id = $(this).attr('name'); 
    $('input:checkbox[id="'+the_id+'"]').attr('checked', ($(this).is(':checked'))); 
    $('input:checkbox[id="'+the_id+'"][value="NONE"]').attr('checked', false); 
}); 

$(":checkbox").filter(function(){ 
    return $(this).closest("td").text()!='NONE'; 
    }).click(function(){ 
    $("td").filter(function(){ 
     return $(this).text()=='NONE'}).find(":checkbox").prop("checked",false); 
    }); 

    $("td").filter(function(){ 
     return $(this).text()=='NONE'}).find(":checkbox").click(function(e){ 
     $(":checkbox").not(this).prop("checked",false); 
    }); 

DEMO

Answer 2

1. элементы доступа по идентификатору, используя селектор идентификатора # - не селектор атрибута
2. Вы не должны использовать один и тот же идентификатор для более чем одного элемента , В противном случае jQuery не сможет найти более одного элемента.
3. Ваш html недействителен. div не является допустимым дочерним элементом для table.

При этом, если пользователь нажимает на флажок с name="107", вы можете снять все галочки внутри сОн элемента с идентификатором check_107, как это, если вы измените от id="all" к class="checkAll"

$('.checkAll').click(function() { 
    var id = $(this).attr("name"); 
    $('#check_' + id + ' input[type=checkbox]').removeAttr("checked"); 
}); 

Answer 3

первых из всего этого неправильно использовать один и тот же идентификатор на странице. почему бы вам не обмануть jQuery?

вместо:

<input type="checkbox" name="accesstimes[]" id="107" value="21" /> 

от

<input type="checkbox" name="accesstimes[]" element_id="107" value="21" /> 

и

<input type="checkbox" name="accesstimes[]" id="107" value="NONE" /> 

от

<input type="checkbox" name="accesstimes[]" element_id="107" class="NONE" /> 

и в конце концов сделать:

$('#all').click(function() { 
      the_id = $(this).attr('name'); 
      $('input:checkbox[element_id="'+the_id+'"]').prop('checked', ($(this).is(':checked'))); 
      $('.NONE').prop('checked', false); 
    }); 

это работает:

EDIT: Я также не реализовал флажок ни для вас;)

http://jsfiddle.net/workdreamer/LGnff/