jQuery获取所选单选button的值
问题陈述很简单。 我需要看看用户是否从收音机组中select了一个单选button。 组中的每个单选button共享相同的ID。
问题是我无法控制如何生成表单。 以下是单选button控制代码的示例代码:
<input type="radio" name='s_2_1_6_0' value='Mail copy to my bill to address' id = "InvCopyRadio" onchange = 'SWESubmitForm(document.SWEForm2_0,s_4,"","1-DPWJJF")' style="height:20;width:25" tabindex=1997 >
除了这个select单选button之外,它不会为控件添加一个“checked”属性只是文本检查 (我猜只是没有值检查的属性) 。 下面是一个选定的无线电控制器的样子
<input type="radio" checked name='s_2_1_6_0' value='Mail copy to my bill to address' id = "InvCopyRadio" onchange = 'SWESubmitForm(document.SWEForm2_0,s_4,"","1-DPWJJF")' style="height:20;width:25" tabindex=1997 >
任何人都可以帮助我使用jQuery代码,可以帮助我获得选中的单选button的值吗?
只是使用。
$('input[name=name_of_your_radiobutton]:checked').val();
这很容易。
首先,你不能有多个具有相同ID的元素。 我知道你说过你无法控制表单是如何创build的,但是…试着以某种方式从收音机中删除所有的ID,或者使它们独一无二。
要获取所选单选button的值,请使用:checked
filter按名称select它。
var selectedVal = ""; var selected = $("input[type='radio'][name='s_2_1_6_0']:checked"); if (selected.length > 0) { selectedVal = selected.val(); }
编辑
所以你不能控制名字。 在这种情况下,我会说这些单选button都放在一个名为radioDiv
的div中,然后稍微修改一下你的select器:
var selectedVal = ""; var selected = $("#radioDiv input[type='radio']:checked"); if (selected.length > 0) { selectedVal = selected.val(); }
获取所选单选button的最简单方法如下:
$("input[name='optradio']:checked").val();
在select器之间不应该使用空间。
- 在您的代码中,jQuery只是查找名为q12_3的input的第一个实例,在这种情况下,它的值为1.您需要input名为q12_3的input
:checked
。
$(function(){ $("#submit").click(function() { alert($("input[name=q12_3]:checked").val()); }); });
- 请注意,上面的代码与使用
.is(":checked")
。 jQuery的is()
函数返回一个布尔值(true或false)而不是元素。
$("#radioID") // select the radio by its id .change(function(){ // bind a function to the change event if( $(this).is(":checked") ){ // check if the radio is checked var val = $(this).val(); // retrieve the value } });
确保将其包装在DOM就绪函数( $(function(){...});
或$(document).ready(function(){...});
)中。
<input type="radio" class="radioBtnClass" name="numbers" value="1" />1<br/> <input type="radio" class="radioBtnClass" name="numbers" value="2" />2<br/> <input type="radio" class="radioBtnClass" name="numbers" value="3" />3<br/>
这将返回,检查单选button的值。
if($("input[type='radio'].radioBtnClass").is(':checked')) { var card_type = $("input[type='radio'].radioBtnClass:checked").val(); alert(card_type); }
要获取所选单选button的值,请使用RadioButtonName和包含RadioButton的表单ID。
$('input[name=radioName]:checked', '#myForm').val()
或仅由
$('form input[type=radio]:checked').val();
检查它的工作正常的例子
<div class="dtl_radio"> Metal purity : <label> <input type="radio" name="purityradio" class="gold_color" value="92" checked=""> 92 % </label> <label> <input type="radio" name="purityradio" class="gold_color" value="75"> 75 % </label> <label> <input type="radio" name="purityradio" class="gold_color" value="58.5"> 58.5 % </label> <label> <input type="radio" name="purityradio" class="gold_color" value="95"> 95 % </label> <label> <input type="radio" name="purityradio" class="gold_color" value="59"> 59 % </label> <label> <input type="radio" name="purityradio" class="gold_color" value="76"> 76 % </label> <label> <input type="radio" name="purityradio" class="gold_color" value="93"> 93 % </label> </div>
var check_value = $('.gold_color:checked').val();
获取所有收音机:
var radios = $("input[type='radio']");
过滤得到一个检查
radios.filter(":checked");
要么
另一种方法可以find单选button的值
var RadeoButtonStatusCheck = $('form input[type=radio]:checked').val();
if (!$("#InvCopyRadio").prop("checked") && $("#InvCopyRadio").prop("checked")) // do something
解释这个简单主题的最好方法是给出一个简单的例子和参考链接:
在下面的例子中,我们有两个单选button。 如果用户select任何单选button,我们将在警告框中显示选定的单选button值。
HTML:
<form id="Demo"> <input type="radio" name="Gender" value="Male" /> Male <br /> <input type="radio" name="Gender" value="Female" /> Female<br /> <input type="radio" name="Gender" value="others" /> others <br /> </form>
jQuery的: –
$(document).ready(function(){ $('#Demo input').on('change', function() { alert($('input[name="Gender"]:checked', '#Demo').val()); }); });
试试这个例子
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1 /jquery.min.js"></script> <form id="myForm"> <input type="radio" name="radio" value="first"/> 1 <br/> <input type="radio" name="radio" value="second"/> 2 <br/> </form> <script> $(document).ready(function () { $('#myForm').on('click', function () { var value = $("[name=radio]:checked").val(); alert(value); }) }); </script>
我不是一个JavaScript的人,但我在这里find这个问题。 对于谁在谷歌,并在这里find,我希望这有助于一些。 因此,如果我们有一个单选button的列表,
<div class="list"> <input type="radio" name="b1" value="1"> <input type="radio" name="b2" value="2" checked="checked"> <input type="radio" name="b3" value="3"> </div>
我可以find哪一个select这个select器:
$('.list input[type="radio"]:checked:first').val();
即使没有select元素,我仍然没有得到未定义的错误。 因此,在获取元素的值之前,您不必额外写入if语句。
这里是非常基本的jsfiddle例子 。
<div id="subscriptions"> Company Suscription: <input type="radio" name="subsrad" value="1"> Customer Subscription:<input type="radio" name="subsrad" value="2"> Manully Set:<input type="radio" name="subsrad" value="MANUAL"> NO Subscription:<input type="radio" name="subsrad" value="0"> </div>
和处理jquery警报值设置/通过div id更改:
$("#subscriptions input") // select the radio by its id .on('change', function(){ // bind a function to the change event alert($('input[name="subsrad"]:checked', '#subscriptions').val()); });
这很容易….: – }
这里有两个单选button,即rd1和Radio1
<input type="radio" name="rd" id="rd1" /> <input type="radio" name="rd" id="Radio1" />
最简单的方法来检查单选button(“:checked”)属性
if ($("#rd1").is(":checked")) { alert("rd1 checked"); } else { alert("rd1 not checked"); }
<input type="radio" name='s_2_1_6_0' value='Mail copy to my bill to address' id = "InvCopyRadio" onchange = 'SWESubmitForm(document.SWEForm2_0,s_4,"","1-DPWJJF")' style="height:20;width:25" tabindex=1997 > $(function() { $("#submit").click(function() { alert($('input[name=s_2_1_6_0]:checked').val()); }); });`
另一种简单的方法来了解…它的工作:
HTML代码:
<input type="radio" name="active_status" class="active_status" value="Hold">Hold <input type="radio" name="active_status" class="active_status" value="Cancel">Cancel <input type="radio" name="active_status" class="active_status" value="Suspend">Suspend
jquery代码:
$(document).on("click", ".active_status", function () { var a = $('input[name=active_status]:checked').val(); (OR) var a = $('.active_status:checked').val(); alert(a); });
$("input[name='gender']:checked").val()
为嵌套的属性
$("input[name='lead[gender]']:checked").val()
不要忘记名字的单个括号