Jak wywołać zdarzenie kliknięcia pola wyboru, nawet jeśli zostało sprawdzone za pomocą kodu JavaScript?

80

Mam wiele pól wyboru na mojej stronie i jest tam pole wyboru zaznacz wszystko, które zaznacza wszystkie pola wyboru. W jakiś sposób chcę emulować to kliknięcie pola wyboru, nawet jeśli jest zaznaczone / niezaznaczone za pomocą przycisku zaznacz wszystko. Jak mogę to zrobić?

— Jishnu AP
źródło

117

Możesz użyć .trigger()metody jQuery . Zobacz http://api.jquery.com/trigger/

Na przykład:

$('#foo').trigger('click');

— Mark Robinson
źródło

13

Możesz też po prostu zadzwonić $('#foo').click(), co skutecznie robi to samo.

— Kevin Babcock

2

Jak to zrobić za pomocą czystego JavaScript?

— Paul

6

pojawia się trigger('click')przełącza bieżącą wartość. Jeśli chcesz to po prostu ustawić, ustaw checkedna true, a następnie wywołaj triggerHandler (...) stackoverflow.com/questions/10268222/ ...

— rogerdpack

1

Jak dokładnie takie posty są oznaczane jako poprawne, gdy wymagają użycia strony trzeciej? Nie prosił o rozwiązanie jQuery.

— Wancieho

@Wancieho Pytanie jest oznaczone jako „jquery”.

— Mark Robinson

15

Uzyskiwanie statusu sprawdzenia

var checked = $("#selectall").is(":checked");

Następnie do ustawienia

$("input:checkbox").attr("checked",checked);

— Harish
źródło

9

Nie próbowałem tego, attrtak jak używam propobecnie, ale ta metoda sprawdza tylko pola, nie uruchamia zdarzenia kliknięcia dla każdego później

— EvilDr

9

Możesz też użyć .change()funkcji

Na przykład:

$('form input[type=checkbox]').change(function() { console.log('hello') });

— silviomoreto
źródło

To nie działa dla mnie, gdy zmiana pola wyboru odbywa się za pomocą JavaScript.

— Flimm

6

nie gQuery

document.getElementById ('your_box'). onclick ();

Użyłem określonej klasy na moich polach wyboru.

var x = document.getElementsByClassName("box_class");
var i;
for (i = 0; i < x.length; i++) {
    if(x[i].checked) x[i].checked = false;
    else x[i].checked = true;
    x[i].onclick();
   }

— Harijs Krūtainis
źródło

6

Możesz również tego użyć, mam nadzieję, że możesz im służyć.

$(function(){
  $('#elements input[type="checkbox"]').prop("checked", true).trigger("change");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

<div id="elements">
  <input type="checkbox" id="item-1" value="1"> Item 1 <br />
  <input type="checkbox" id="item-2" value="2" disabled> Item 2 <br /> 
  <input type="checkbox" id="item-3" value="3" disabled> Item 3 <br />
  <input type="checkbox" id="item-4" value="4" disabled> Item 4 <br />
  <input type="checkbox" id="item-5" value="5"> Item 5
</div>

Rozwiń fragment

— Uczenie się i dzielenie się
źródło

4

Odpowiedzią może być funkcja wyzwalania z jQuery.

Dokumentacja jQuery mówi: Wszystkie programy obsługi zdarzeń dołączone za pomocą .on () lub jednej z jej metod skrótów są wyzwalane, gdy wystąpi odpowiednie zdarzenie. Można je jednak uruchomić ręcznie za pomocą metody .trigger (). Wywołanie .trigger () wykonuje programy obsługi w tej samej kolejności, w jakiej byłyby, gdyby zdarzenie zostało wyzwolone w sposób naturalny przez użytkownika

Dlatego najlepszym rozwiązaniem jednoprzewodowym powinno być:

$('.selector_class').trigger('click');

//or

$('#foo').click();

1

  $("#gst_show>input").change(function(){

    var checked = $(this).is(":checked");
    if($("#gst_show>input:checkbox").attr("checked",checked)){
      alert('Checked Successfully');
    }

  });

— Raj Shekhar
źródło

2

CZY MOŻESZ WYJAŚNIĆ SWÓJ KOD

— Yilmaz