当前位置:  开发笔记 > 编程语言 > 正文

我怎么知道通过jQuery选择了哪个单选按钮?

如何解决《我怎么知道通过jQuery选择了哪个单选按钮?》经验,为你挑选了23个好方法。

我有两个单选按钮,想要发布所选的一个值.如何通过jQuery获取值?

我可以像这样得到所有这些:

$("form :radio")

我如何知道选择了哪一个?



1> Peter J..:

要获取具有ID的表单的选定 radioName项的值,请执行以下操作myForm:

$('input[name=radioName]:checked', '#myForm').val()

这是一个例子:

$('#myForm input').on('change', function() {
   alert($('input[name=radioName]:checked', '#myForm').val()); 
});

1
2
3


2> Joberror..:

用这个..

$("#myform input[type='radio']:checked").val();


如果你的表单有多组单选按钮,我认为这只会得到第一组的值.
这将仅返回在表单中检查的第一个单选按钮的值.它应该像Peter J所建议的那样完成.
@MickJ这段代码与Peter J的代码相同...考虑原始问题的用例.但是,如果您有各种单选按钮组,则无法使用.这就是为什么使用[name = selector]会更好的原因

3> Matt Browne..:

如果您已经有对单选按钮组的引用,例如:

var myRadio = $("input[name=myRadio]");

使用该filter()功能,而不是find().(find()用于查找子/后代元素,而filter()在您的选择中搜索顶级元素.)

var checkedValue = myRadio.filter(":checked").val();

注意:这个答案最初正在纠正推荐使用的另一个答案,这个答案find()似乎已经改变了.find()对于已经有一个容器元素引用而不是单选按钮的情况,它仍然有用,例如:

var form = $("#mainForm");
...
var checkedValue = form.find("input[name=myRadio]:checked").val();


为了清楚起见,我只想添加find()实际上搜索*all*descendent元素(与给定的选择器匹配).如果您只想要直接孩子,请使用children().

4> 小智..:

这应该工作:

$("input[name='radioName']:checked").val()

请注意输入周围的"使用:检查而不是像Peter J的解决方案"



5> tvanfosson..:

您可以使用:checked选择器和无线电选择器.

 $("form:radio:checked").val();


这看起来不错,但是,[jQuery文档](http://api.jquery.com/radio-selector/)建议使用[type = radio]而不是:radio来获得更好的性能.这是可读性和性能之间的权衡.我通常会在这些微不足道的事情上对性能进行可读性,但在这种情况下,我认为[type = radio]实际上更清晰.所以在这种情况下,它看起来像$("表单输入[type = radio]:checked").val().但仍然是一个有效的答案.

6> 小智..:

如果你只想要布尔值,即是否检查它,请尝试:

$("#Myradio").is(":checked")



7> Alex V..:

获取所有无线电:

var radios = jQuery("input[type='radio']");

过滤以获得已检查的那个

radios.filter(":checked")



8> RedDragon..:

另一种选择是:

$('input[name=radioName]:checked').val()


这里不需要":无线电"部分.

9> Phillip Senn..:
$("input:radio:checked").val();



10> Darin Peters..:

这是我如何编写表单并处理已检查无线电的获取.

使用名为myForm的表单:

...

从表单中获取值:

$('#myForm .radio1:checked').val();

如果您没有发布表单,我会使用以下内容进一步简化:



然后获取选中的值变为:

    $('.radio1:checked').val();

在输入上有一个类名允许我轻松设置输入样式...



11> rmbianchi..:

在我的情况下,我有一个形式的两个单选按钮,我想知道每个按钮的状态.以下这个对我有用:

// get radio buttons value
console.log( "radio1: " +  $('input[id=radio1]:checked', '#toggle-form').val() );
console.log( "radio2: " +  $('input[id=radio2]:checked', '#toggle-form').val() );


    



12> Francisco Al..:

JSF生成的单选按钮(使用标记)中,您可以执行以下操作:

radiobuttonvalue = jQuery("input[name='form_id\:radiobutton_id']:checked").val();

其中selectOneRadio ID是radiobutton_id,表单ID是form_id.

请确保使用name而不是id,因为jQuery使用此属性(名称由JSF自动生成,类似于控件ID).



13> 小智..:

另外,检查用户是否未选择任何内容.

var radioanswer = 'none';
if ($('input[name=myRadio]:checked').val() != null) {           
   radioanswer = $('input[name=myRadio]:checked').val();
}



14> Mathias Lykk..:

我写了一个jQuery插件,用于设置和获取单选按钮值.它还尊重他们的"改变"事件.

(function ($) {

    function changeRadioButton(element, value) {
        var name = $(element).attr("name");
        $("[type=radio][name=" + name + "]:checked").removeAttr("checked");
        $("[type=radio][name=" + name + "][value=" + value + "]").attr("checked", "checked");
        $("[type=radio][name=" + name + "]:checked").change();
    }

    function getRadioButton(element) {
        var name = $(element).attr("name");
        return $("[type=radio][name=" + name + "]:checked").attr("value");
    }

    var originalVal = $.fn.val;
    $.fn.val = function(value) {

        //is it a radio button? treat it differently.
        if($(this).is("[type=radio]")) {

            if (typeof value != 'undefined') {

                //setter
                changeRadioButton(this, value);
                return $(this);

            } else {

                //getter
                return getRadioButton(this);

            }

        } else {

            //it wasn't a radio button - let's call the default val function.
            if (typeof value != 'undefined') {
                return originalVal.call(this, value);
            } else {
                return originalVal.call(this);
            }

        }
    };
})(jQuery);

将代码放在任何位置以启用插件.然后享受!它只是覆盖默认的val函数而不会破坏任何东西.

你可以访问这个jsFiddle来试一试它,看看它是如何工作的.

小提琴



15> 小智..:

如果您有单个形式的多个单选按钮,那么

var myRadio1 = $('input[name=radioButtonName1]');
var value1 = myRadio1.filter(':checked').val();

var myRadio2 = $('input[name=radioButtonName2]');
var value2 = myRadio2.filter(':checked').val();

这对我有用.



16> 小智..:
 $(".Stat").click(function () {
     var rdbVal1 = $("input[name$=S]:checked").val();
 }



17> Manoj..:

这很好用

$('input[type="radio"][class="className"]:checked').val()

工作演示

:checked选择工程checkboxes,radio buttons并选择要素.仅对于选择元素,请使用:selected选择器.

API for :checked Selector



18> Rodrigo Dias..:

要获取使用类的所选无线电的值:

$('.class:checked').val()



19> 小智..:

用这个:

value = $('input[name=button-name]:checked').val();



20> Lafif Astahd..:

我用这个简单的脚本

$('input[name="myRadio"]').on('change', function() {
  var radioValue = $('input[name="myRadio"]:checked').val();        
  alert(radioValue); 
});



21> Code Spy..:

演示:https://jsfiddle.net/ipsjolly/xygr065w/

	$(function(){
	    $("#submit").click(function(){      
	        alert($('input:radio:checked').val());
	    });
	 });

Sales Promotion 1 2 3 4 5


22> Randy Greenc..:

如果你在1个表单上只有一组单选按钮,那么jQuery代码就像这样简单:

$( "input:checked" ).val()



23> Ryan..:

我已经发布了一个库来帮助解决这个问题.实际上,拉出所有可能的输入值,但也包括检查了哪个单选按钮.您可以访问https://github.com/mazondo/formalizedata查看

它会给你一个答案的js对象,所以形式如下:

Blue Red

会给你:

$("form").formalizeData()
{
  "favorite-color" : "blue"
}

推荐阅读
郑谊099_448
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有