Am 3 butoane radio în pagina mea de web, ca mai jos:
<label for="theme-grey">
<input type="radio" id="theme-grey" name="theme" value="grey" />Grey</label>
<label for="theme-pink">
<input type="radio" id="theme-pink" name="theme" value="pink" />Pink</label>
<label for="theme-green">
<input type="radio" id="theme-green" name="theme" value="green" />Green</label>
În jQuery, vreau pentru a obține valoarea de la buton radio selectat atunci când oricare din aceste trei se face clic. În jQuery avem id-ul (#) și clasa (.) selectoare, dar ce se întâmplă dacă vreau să găsesc un buton radio de numele său, ca mai jos?
$("<radiobutton name attribute>").click(function(){});
Te rog spune-mi cum să rezolve această problemă.
Acest lucru ar trebui să facă, toate de acest lucru este în documentația, care are o foarte similare exemplu pentru asta:
$("input[type='radio'][name='theme']").click(function() {
var value = $(this).val();
});
Eu ar trebui să rețineți, de asemenea, aveți mai multe Id-uri identice în acest fragment. Acest lucru este valid HTML. Clasele de utilizare pentru a grupa un set de elemente, nu Id-uri, deoarece acestea ar trebui să fie unic.
Pentru a determina care buton radio este verificat, încercați acest lucru:
$('input:radio[name=theme]').click(function() {
var val = $('input:radio[name=theme]:checked').val();
});
Evenimentul va fi prins pentru toate butoanele radio din grup și valoarea de butonul selectat va fi plasat în val.
Update: După postarea am decis că Paolo's răspunsul de mai sus este mai bine, deoarece folosește unul mai puțin DOM traversare. Voi lăsa acest răspuns sta, deoarece arată cum să obțineți elementul selectat într-un mod care este cross-browser compatibil.
Aceasta funcționează foarte bine pentru mine. De exemplu, aveți două butoane radio cu același "nume", și ai vrut doar pentru a obține valoarea de verificat una. Puteți încerca acest unul.
$valueOfTheCheckedRadio = $('[name=radioName]:checked').val();
Următorul cod este folosit pentru a obține buton radio selectat valoarea de nume
jQuery("input:radio[name=theme]:checked").val();
Multumesc Adnan
Am găsit această întrebare ca am fost cercetarea o eroare dupa ce am facut upgrade de la 1.7.2 de jQuery pentru a 1.8.2. Am'm adăugarea de răspunsul meu, pentru că acolo a fost o schimbare în jQuery 1.8 și mai mari, care schimbă modul în care această întrebare este răspuns acum.
Cu jQuery 1.8-au depreciat pseudo-selectoare, cum ar fi :radio :selectare :text.
Pentru a face cele de mai sus acum doar înlocuiți :radio " cu " [type=radio]
.
Deci, răspunsul devine acum pentru toate versiunile de jQuery 1.8 și mai sus:
$("input[type=radio][name=theme]").click(function() {
var value = $(this).val();
});
Puteți citi despre modificare pe 1.8 readme și biletul specifice pentru această schimbare, precum și un înțeles de ce pe :radio selector de pagină în secțiunea Informații Suplimentare.
Pentru oricine care nu't doriți să includeți o bibliotecă pentru a face ceva foarte simplu:
document.querySelector('[name="theme"]:checked').value;
Pentru o performanta de ansamblu a actualului răspunsuri verificați aici
Puteți utiliza funcția de filtru dacă aveți mai mult de un grup de radio de pe pagina, ca mai jos
$('input[type=radio]').change(function(){
var value = $(this).filter(':checked' ).val();
alert(value);
});
Aici este vioara url
<input type="radio" name="ans3" value="help">
<input type="radio" name="ans3" value="help1">
<input type="radio" name="ans3" value="help2">
<input type="radio" name="ans2" value="test">
<input type="radio" name="ans2" value="test1">
<input type="radio" name="ans2" value="test2">
<script type="text/javascript">
var ans3 = jq("input[name='ans3']:checked").val()
var ans2 = jq("input[name='ans2']:checked").val()
</script>
Ceva de genul acest lucru poate?
$("input:radio[name=theme]").click(function() {
...
});
Atunci când faceți clic pe orice buton radio, cred că se va termina până selectate, astfel încât acesta va fi numit pentru buton radio selectat.
Nu aveți mai mult de un grup de butoane radio pe aceeași pagină, puteți încerca, de asemenea, acest lucru pentru a obține valoarea de buton radio:
$("input:radio[type=radio]").click(function() {
var value = $(this).val();
alert(value);
});
Noroc!
Aceasta a lucrat pentru mine..
HTML:
<input type="radio" class="radioClass" name="radioName" value="1" />Test<br/>
<input type="radio" class="radioClass" name="radioName" value="2" />Practice<br/>
<input type="radio" class="radioClass" name="radioName" value="3" />Both<br/>
Jquery:
$(".radioClass").each(function() { if($(this).is(':checked')) alert($(this).val()); });
Sper că vă ajută..
S-ar putea observa folosind selectorul de clasă pentru a obține valoarea de ASP.NET RadioButton de control este întotdeauna gol și aici este motivul.
Puteți crea RadioButton de control în ASP.NET
ca mai jos:
<asp:RadioButton runat="server" ID="rbSingle" GroupName="Type" CssClass="radios" Text="Single" />
<asp:RadioButton runat="server" ID="rbDouble" GroupName="Type" CssClass="radios" Text="Double" />
<asp:RadioButton runat="server" ID="rbTriple" GroupName="Type" CssClass="radios" Text="Triple" />
Și ASP.NET
face următoarele HTML pentru RadioButton`
<span class="radios"><input id="Content_rbSingle" type="radio" name="ctl00$Content$Type" value="rbSingle" /><label for="Content_rbSingle">Single</label></span>
<span class="radios"><input id="Content_rbDouble" type="radio" name="ctl00$Content$Type" value="rbDouble" /><label for="Content_rbDouble">Double</label></span>
<span class="radios"><input id="Content_rbTriple" type="radio" name="ctl00$Content$Type" value="rbTriple" /><label for="Content_rbTriple">Triple</label></span>
Pentru ASP.NETnu ne't doriți să utilizați
RadioButton de control numele sau id-ul, deoarece acestea pot modifica pentru orice motiv de utilizator's de mână (schimbare în container numele, forma nume, usercontrol nume, ...) după cum puteți vedea în codul de mai sus.
Singura modalitate fezabilă de a primi valoarea RadioButton
folosind jQuery este folosind clasa css cum se menționează în acest răspunsul la o altă întrebare, după cum urmează
$('span.radios input:radio').click(function() {
var value = $(this).val();
});