jquery 如何获取单选框的值

jquery 如何获取单选框的值,第1张

获取单选框的值有三种方式:

1、$('input:radio:checked')val();

2、$("input[type='radio']:checked")val();

3、$("input[name='rd']:checked")val();

有两种情况:

1、你的allchecked 没有定义

2、你的html源码中不是所有radio元素的属性checked的值都为checked,即

有的为:

<input type="radio" checked />

<input type="radio" checked=“true” />

有的是:

<input type="radio" checked=“checked” />

这时候肯定不能全部获取啦~

最保险的就这样写:

$('input[type="radio"]')prop("checked",true)each(function () {

                        allchecked += thisvaluetoString() + ",";

                    });

//jquery 中prop方法是用来判断逻辑值的,所以像这种判断有没有被选中等逻辑值的情况就用prop()就好啦~

你的$("input[name=jizai]")这个选择器会获得两个radio对象,都设置选中,只能最后一个是被选中的,因为是单选。

如果你要这么写,可以指定索引,

如:$("input[name=jizai]:eq(0)")attr("checked",'checked'); 这样就是第一个选中咯。

jquery中,radio的选中与否是这么设置的。

$("#rdo1")attr("checked","checked");

$("#rdo1")removeAttr("checked");

还有问题hi我哦。

整体思路:首先利用JQ分别获取不同name值的radio的选中的值,然后将获取到的值都统一赋给前台某个标签即可。

①:在html文件中,创建radio控件及文本标签;如

<input type="radio" name="radio1" value="1" />

<input type="radio" name="radio1" value="2" />

<br/>

<input type="radio" name="radio2" value="a" />

<input type="radio" name="radio2" value="b" />

<br/>

<input type="text" id="textBox" />

<input type="button" value="确定" class="btn" />

注意,name值一样才能实现radio单选;

②:在Javascript代码中,获取radio选中的值;

var radioVal01 = $("input[name='radio1']:checked")val();

var radioVal02 = $("input[name='radio2']:checked")val();

③:将获取到的值赋给text文本标签

$("btn")click(function(){

var radioVal01 = $("input[name='radio1']:checked")val();

var radioVal02 = $("input[name='radio2']:checked")val();

$("#textBox")val(radioVal01 + "," + radioVal02); //拼接两个选中的值,以逗号隔开

});

jquery 获取 input type radio checked的元素

find('input:radio:checked');

find("input[type='radio']:checked");

find("input[name='radio']:checked");

find("input[@name='radio'][checked]");

find("input[name='radio']")filter(':checked');

以上就是关于jquery 如何获取单选框的值全部的内容,包括:jquery 如何获取单选框的值、jquery radio $('input[checked="checked"]')非兼容模式下无法获取选中状态、jquery设置radio选中等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/web/9418415.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-28
下一篇 2023-04-28

发表评论

登录后才能评论

评论列表(0条)

保存