Man HTML veidlapā ir divas radio pogas. Dialoglodziņš parādās, ja viens no laukiem ir nulle. Kā es varu pārbaudīt, vai radio poga ir izvēlēta?
Pieņemsim, ka jums ir šāds HTML formāts.
<input type="radio" name="gender" id="gender_Male" value="Male" />
<input type="radio" name="gender" id="gender_Female" value="Female" />
Klienta puses validācijai šeit ir daži Javascript, lai pārbaudītu, kurš no tiem ir izvēlēts:
if(document.getElementById('gender_Male').checked) {
//Male radio button is checked
}else if(document.getElementById('gender_Female').checked) {
//Female radio button is checked
}
Iepriekš minēto var padarīt efektīvāku atkarībā no precīzas jūsu marķējuma būtības, bet ar to vajadzētu pietikt, lai sāktu darbu.
Ja jūs vienkārši vēlaties redzēt, vai ir izvēlēta kāda radio poga, PrototypeJS to ļoti atvieglo.
Šeit ir funkcija, kas atgriezīs true, ja kaut kur lapā ir izvēlēta vismaz viena radio poga. Atkārtoti, iespējams, ka šī funkcija būs jāpielāgo atkarībā no jūsu konkrētā HTML.
function atLeastOneRadio() {
return ($('input[type=radio]:checked').size() > 0);
}
Servera puses validācijai (atcerieties, ka validācija nevar būt pilnībā atkarīga no Javascript!), tas būtu atkarīgs no jūsu izvēlētās valodas, bet jūs pārbaudītu pieprasījuma virknes dzimuma
vērtību.
Izmantojot jQuery, tas būtu apmēram šāds.
if ($('input[name=gender]:checked').length > 0) {
// do something here
}
Ļaujiet man to sadalīt pa gabaliņiem, lai skaidrāk to aptvertu. jQuery apstrādā lietas no kreisās puses uz labo.
input[name=gender]:checked
input
ierobežo to līdz ievades tagiem.[
[name=dzimums]`]3 ierobežo to uz tagiem ar nosaukumu gender iepriekšējā grupā.:checked
ierobežo to līdz izvēles rūtiņām/radio pogām, kas ir atzīmētas iepriekšējā grupā.Ja vēlaties no tā pilnībā izvairīties, HTML kodā atzīmējiet vienu no radio pogām kā atzīmētu (checked="checked"
), kas garantētu, ka viena radio poga vienmēr ir atzīmēta.
Vaniļas JavaScript veids
var radios = document.getElementsByTagName('input');
var value;
for (var i = 0; i < radios.length; i++) {
if (radios[i].type === 'radio' && radios[i].checked) {
// get value, set checked flag or do whatever you need to
value = radios[i].value;
}
}