jQuery to framework Javascript, który może uprościć kodowanie Javascript dla strony internetowej i usuwa wiele problemów z kompatybilnością między przeglądarkami. Wczoraj przyjrzałem się, jak uzyskać i ustawić wartości elementów formularza za pomocą jQuery, ale nie radziłem sobie z polami wyboru. Dzisiejszy post wygląda na to, jak powiedzieć, czy pole wyboru formularza HTML jest zaznaczone, czy nie jest zaznaczone za pomocą jQuery, a następnie jak go zmienić, aby był un / checked.
przykładowy formularz
nasz przykładowy formularz wygląda następująco:
<input type="checkbox" name="foo" value="bar" /><input type="button" onclick="show_checked()" value="Show" /><input type="button" onclick="set_checked(true)" value="On" /><input type="button" onclick="set_checked(false)" value="Off" />
jest pole wyboru z nazwą „foo”, a następnie trzy przyciski. Pierwszy wywołuje funkcję, która pokazuje nam, czy pole wyboru jest zaznaczone, czy nie, a drugie dwa zmieniają go z zaznaczonego na niezaznaczony.
sprawdź, czy pole wyboru jest zaznaczone
istnieje kilka sposobów, aby dowiedzieć się, czy pole wyboru jest zaznaczone, czy nie za pomocą jQuery, a tutaj kilka alternatyw. Każdy zwróci true, jeśli jest zaznaczone lub false, jeśli nie jest.
$('input').is(':checked')$('input').attr('checked')
Ustaw pole wyboru na zaznaczone lub nie zaznaczone
status pola wyboru można zmienić za pomocą funkcji attr() w ten sposób, aby zaznaczyć pole:
$('input').attr('checked', true);
i tak, aby odznaczyć pole:
$('input').attr('checked', false);
działający przykład
i na koniec przykładowy formularz w akcji:
uwaga o wartościach logicznych
w komentarzach poniżej znajduje się dyskusja na temat problemów znalezionych w Chromium, które mogą być związane z przekazywaniem wartości ciągów true I false, podczas gdy musi to być ściśle logiczna prawda lub FAŁSZ w przeciwnym razie mogą wystąpić nieoczekiwane konsekwencje.
zasugerowano użycie .zamiast tego removeAttr (), ale może to mieć inne konsekwencje z mojego czytania komentarzy na stronie dokumentacji jQuery dla funkcji. Będę kontynuował ten post w późniejszym terminie i zrobię więcej testów, aby potwierdzić na pewno
przełączanie pola wyboru po kliknięciu etykiety
zauważ, że Javascript nie jest wymagany do przełączania pola wyboru po kliknięciu jakiegoś tekstu; do tego służą HTML <Etykieta>s. Przeczytaj mój post za pomocą HTML < Etykieta>, aby przełączyć i wybrać pola, aby uzyskać więcej informacji.