jQuery. Jak usunąć zaznaczenie wszystkich pól wyboru oprócz jednego (co było zaznaczone)

Mam elementy HTML 4 Przykład:jQuery. Jak usunąć zaznaczenie wszystkich pól wyboru oprócz jednego (co było zaznaczone)

<div> 
    <div><input type="checkbox" class="foo"> Checkbox</div> 
    <div><input type="checkbox" class="foo"> Checkbox</div> 
    <div><input type="checkbox" class="foo"> Checkbox</div> 
    <div><input type="checkbox" class="foo"> Checkbox</div> 
    <div><input type="checkbox" class="foo"> Checkbox</div> 
    <div><input type="checkbox" class="foo"> Checkbox</div> 
</div>

A teraz, chcę dalej: Gdybym kliknąć na dowolny wyboru - pole wyboru powinno być sprawdzone i inne pola wyboru powinny być odznaczone. Jak mogę to zrobić?

Źródło

2012-12-06 Andrew

Co chcesz nazywany jest przełącznik ... – RRikesh

@ François Wahl, nie ma problemu! Nie wiedziałem o tym. – Andrew

Możesz użyć przycisku radio i pogrupować je według atrybutów nazwy. Jeśli masz to zrobić z checkboxes następnie można zrobić to w ten sposób,

Live Demo

$('.foo').click(function(){  
     $('.foo').attr('checked', false); 
     $(this).attr('checked', true);   
});

generowanych dynamicznie html trzeba on który pozwala przekazać zdarzenie z rodzicem statycznego, można używaj dokumentu, nie znasz statycznego rodzica.

$(document).on('click','.foo', function(){  
     $('.foo').attr('checked', false); 
     $(this).attr('checked', true);   
});

Dokument może zostać zastąpiony statycznym rodzicem, jeśli jest znany. na przykład jeśli div zawierają generowane dynamicznie posiada identyfikator parentdiv wtedy można mieć

`$('#parentdiv').on('click','.foo', function(){`

Edycja

Korzystając prop zamiast attr o właściwościach checked, selected lub disabled zgodnie z dokumentacją.

jako jQuery 1.6, .attr (metoda) powraca niezdefiniowane atrybuty, które nie zostały określone. Aby pobrać i zmienić właściwości DOM, takie jak sprawdzony, zaznaczony lub wyłączony stan elementów formularza, należy użyć metody .prop().

Źródło

2012-12-06 07:50:48 Adil

Dziękuję bardzo za odpowiedź. Wiem o grupie "radiobutton". Ale nie mogę go użyć, ponieważ muszę mieć różne nazwy dla mojego kontrolera Spring MVC. Z tego powodu zdecydowałem się użyć pola wyboru i JavaScript – Andrew

+21

+1: dla rozwiązania roboczego i DEMO. Ogólnie rzecz biorąc, alternatywą dla jednego liniowca byłoby: '$ ('. Foo'). Not (this) .attr ('checked', false);' – Nope

Thanks @ FrançoisWahl, Sugerowane zdanie jest bardzo miłe. – Adil

Oto nieco zdarzyło mi się pracować nad:

.siblings("input[type='checkbox']").attr("checked", true);

będzie zaznaczyć wszystkie pola wyboru z wyjątkiem jednego, który został kliknięty.

$("input[type=checkbox]").on("click", function() { 
 

 
    if ($(this).val() == "none") { 
 
    
 
    $(this).siblings("input[type=checkbox]").attr('checked', false); 
 
    
 
    } else { 
 
    
 
    $(this).siblings("input[value=none]").attr('checked', false); 
 

 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 

 
    <input type="checkbox" id="worker-soft-eaglesoft" checked><label for="worker-soft-eaglesoft">&nbsp;Eaglesoft</label><br> 
 
    <input type="checkbox" id="worker-soft-dentrix"><label for="worker-soft-dentrix">&nbsp;Dentrix</label><br> 
 
    <input type="checkbox" id="worker-soft-softDent"><label for="worker-soft-softDent">&nbsp;Soft-Dent</label><br> 
 
    <input type="checkbox" id="worker-soft-denticon"><label for="worker-soft-denticon">&nbsp;Denticon</label><br> 
 
    <input type="checkbox" id="worker-soft-other"><label for="worker-soft-other">&nbsp;Other</label><br> 
 

 
    <input type="checkbox" id="worker-soft-none" value="none"> 
 
    <label for="worker-soft-none">&nbsp;No Software Experience - Paper Records Only</label><br> 
 
</div>

Źródło

2017-03-14 22:34:58 Beefjeff

jQuery. Jak usunąć zaznaczenie wszystkich pól wyboru oprócz jednego (co było zaznaczone)

Odpowiedz

Powiązane problemy