JQuery:如何获得选中的单选按钮值?

Sta*_*eyH 43 javascript jquery jquery-selectors

如何将未选中的单选按钮的值默认为0

我有以下HTML:

<input type="radio" name="myradiobutton" value="1" />1
<input type="radio" name="myradiobutton" value="2" />2
<input type="radio" name="myradiobutton" value="3" />3
Run Code Online (Sandbox Code Playgroud)

我有以下代码来获取所选单选按钮的值

var radio_button_value $('input[name=myradiobutton]:radio').click(function() {var value = $(this).val();});
Run Code Online (Sandbox Code Playgroud)

问题是,我想的默认值radio_button_value,以0在事件没有被选中.我怎么做?

我基本上想做下面的pseduo代码(但这不起作用)

var radio_button_value $('input[name=myradiobutton]:radio').click(function() { 
if set
  return $(this).val();
else
  return 0;
});
Run Code Online (Sandbox Code Playgroud)

UPDATE

我要求的东西似乎有些混乱.

当页面加载时(在用户甚至有机会选择单选按钮之前)我想要做的事情,我想要一个函数,它将为单选按钮值返回0.

然后,一旦用户选择了单选按钮,该SAME功能将返回单选按钮的选定值.

合理?

Joh*_*ock 91

$('input[name=myradiobutton]:radio:checked')将为您提供所选的单选按钮, $('input[name=myradiobutton]:radio:not(:checked)')将为您提供未选中的单选按钮

使用它你可以做到这一点

$('input[name=myradiobutton]:radio:not(:checked)').val("0");
Run Code Online (Sandbox Code Playgroud)

更新: 阅读更新后我想我明白你会想做这样的事情

var myRadioValue;

function radioValue(jqRadioButton){
  if (jqRadioButton.length) {
    myRadioValue = jqRadioButton.val();
  }
  else {
    myRadioValue = 0;
  }
}

$(document).ready(function () {
  $('input[name=myradiobutton]:radio').click(function () {   //Hook the click event for selected elements
    radioValue($('input[name=myradiobutton]:radio:checked'));
  });

  radioValue($('input[name=myradiobutton]:radio:checked')); //check for value on page load
});
Run Code Online (Sandbox Code Playgroud)


Dex*_*ter 18

使用:checked选择器确定是否选择了一个值:

function getRadioValue () {
    if( $('input[name=myradiobutton]:radio:checked').length > 0 ) {
        return $('input[name=myradiobutton]:radio:checked').val();
    }
    else {
        return 0;
    }
}
Run Code Online (Sandbox Code Playgroud)

更新您可以随时调用上面的函数来获取单选按钮的选定值.您可以在加载时挂钩,然后每当值随以下事件发生变化时:

$(document).ready( function() {
    // Value when you load the page for the first time
    // Will return 0 the first time it's called
    var radio_button_value = getRadioValue();

    $('input[name=myradiobutton]:radio').click( function() {
        // Will get the newly selected value
        radio_button_value = getRadioValue();
    });
}
Run Code Online (Sandbox Code Playgroud)


小智 9

它会在页面加载后立即启动.您可以将其保留在某些事件中,例如按钮单击

$("#btn").click(function() { 
var val= $('input[type="radio"]:checked').val();
});
Run Code Online (Sandbox Code Playgroud)


小智 6

jQuery("input:radio[name=myradiobutton]:checked").val();
Run Code Online (Sandbox Code Playgroud)


End*_*der 4

最好的方法(特别是如果您希望能够发布默认值)可能是有一个隐藏的单选按钮,该按钮一开始就是选定的并具有您的默认值。所以像这样:

<input type="radio" name="myradiobutton" value="0" checked="checked" style="display:none;" />
<input type="radio" name="myradiobutton" value="1" />1
<input type="radio" name="myradiobutton" value="2" />2
<input type="radio" name="myradiobutton" value="3" />3
Run Code Online (Sandbox Code Playgroud)

如果你不能直接修改你的html,你可以通过脚本添加它:

$(function() {
    $('input[name=myradiobutton]:radio:first').before('<input type="radio" name="myradiobutton" value="0" checked="checked" style="display:none;" />');
});
Run Code Online (Sandbox Code Playgroud)

这是一个演示:http://jsfiddle.net/Ender/LwPCv/