我有两个单选按钮，想要发布所选按钮的值。 如何使用 jQuery 获取值？
我可以像这样得到所有这些：
$("form :radio")
我如何知道选择了哪一个？
获取 id 为 radioName 的表单的
selected
myForm$('input[name=radioName]:checked', '#myForm').val()
这是一个例子：
$('#myForm input').on('change', function() {
alert($('input[name=radioName]:checked', '#myForm').val());
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="myForm">
<fieldset>
<legend>Choose radioName</legend>
<label><input type="radio" name="radioName" value="1" /> 1</label> <br />
<label><input type="radio" name="radioName" value="2" /> 2</label> <br />
<label><input type="radio" name="radioName" value="3" /> 3</label> <br />
</fieldset>
</form>用这个..
$("#myform input[type='radio']:checked").val();
如果您已经有对单选按钮组的引用，例如：
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();
这应该有效：
$("input[name='radioName']:checked").val()
注意输入周围使用的“”：checked，而不是像Peter J的解决方案那样的“”
您可以将 :checked 选择器与单选选择器一起使用。
$("form:radio:checked").val();
如果您只想要布尔值，即是否选中它，请尝试以下操作：
$("#Myradio").is(":checked")
获取所有收音机：
var radios = jQuery("input[type='radio']");
筛选以获取选中的内容
radios.filter(":checked")
另一种选择是：
$('input[name=radioName]:checked').val()
$("input:radio:checked").val();
就我而言，我在一种表单中有两个单选按钮，我想知道每个按钮的状态。 下面这对我有用：
// get radio buttons value
console.log( "radio1: " + $('input[id=radio1]:checked', '#toggle-form').val() );
console.log( "radio2: " + $('input[id=radio2]:checked', '#toggle-form').val() );
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="toggle-form">
<div id="radio">
<input type="radio" id="radio1" name="radio" checked="checked" /><label for="radio1">Plot single</label>
<input type="radio" id="radio2" name="radio"/><label for="radio2">Plot all</label>
</div>
</form>这是我如何编写表格并处理获取已检查收音机的方法。
使用名为 myForm 的表单：
<form id='myForm'>
<input type='radio' name='radio1' class='radio1' value='val1' />
<input type='radio' name='radio1' class='radio1' value='val2' />
...
</form>
从表单中获取值：
$('#myForm .radio1:checked').val();
如果您不发布表格，我将使用以下方法进一步简化它：
<input type='radio' class='radio1' value='val1' />
<input type='radio' class='radio1' value='val2' />
那么获取选中的值就变成：
$('.radio1:checked').val();
在输入上有一个类名可以让我轻松地设置输入的样式...
试试这个。 它对我有用
$('input[type="radio"][name="name"]:checked').val();
在 JSF 生成的单选按钮（使用
<h:selectOneRadio>radiobuttonvalue = jQuery("input[name='form_id\:radiobutton_id']:checked").val();
其中 selectOneRadio ID 为 radiobutton_id，表单 ID 为 form_id。
请务必使用 name 代替 id，如图所示，因为 jQuery 使用此属性（name 由 JSF 自动生成，类似于控件 ID）。
此外，检查用户是否未选择任何内容。
var radioanswer = 'none';
if ($('input[name=myRadio]:checked').val() != null) {
radioanswer = $('input[name=myRadio]:checked').val();
}
如果您有单一形式的多个单选按钮，则
var myRadio1 = $('input[name=radioButtonName1]');
var value1 = myRadio1.filter(':checked').val();
var myRadio2 = $('input[name=radioButtonName2]');
var value2 = myRadio2.filter(':checked').val();
这对我有用。
我编写了一个 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 来尝试一下它的实际效果，看看它是如何工作的。
$(".Stat").click(function () {
var rdbVal1 = $("input[name$=S]:checked").val();
}
这个效果很好
$('input[type="radio"][class="className"]:checked').val()
:checkedcheckboxesradio buttons:selected:checked Selector要获取使用类的所选无线电的值：
$('.class:checked').val()
我使用这个简单的脚本
$('input[name="myRadio"]').on('change', function() {
var radioValue = $('input[name="myRadio"]:checked').val();
alert(radioValue);
});
使用这个：
value = $('input[name=button-name]:checked').val();
演示：https://jsfiddle.net/ipsjolly/xygr065w/
$(function(){
$("#submit").click(function(){
alert($('input:radio:checked').val());
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
<td>Sales Promotion</td>
<td><input type="radio" name="q12_3" value="1">1</td>
<td><input type="radio" name="q12_3" value="2">2</td>
<td><input type="radio" name="q12_3" value="3">3</td>
<td><input type="radio" name="q12_3" value="4">4</td>
<td><input type="radio" name="q12_3" value="5">5</td>
</tr>
</table>
<button id="submit">submit</button>如果 1 个表单上只有 1 组单选按钮，则 jQuery 代码就像这样简单：
$( "input:checked" ).val()
我发布了一个库来帮助解决这个问题。实际上，提取所有可能的输入值，但还包括选中了哪个单选按钮。您可以在https://github.com/mazondo/formalizedata
查看它会给你一个答案的 js 对象，所以形式如下：
<form>
<input type="radio" name"favorite-color" value="blue" checked> Blue
<input type="radio" name="favorite-color" value="red"> Red
</form>
会给你：
$("form").formalizeData()
{
"favorite-color" : "blue"
}
JQuery 获取表单中所有单选按钮以及选中的值。
$.each($("input[type='radio']").filter(":checked"), function () {
console.log("Name:" + this.name);
console.log("Value:" + $(this).val());
});
使用
$('input[name="radioName"]').filter(":checked").val();已测试，有效
表格
<form id="myForm">
<input type="radio" name="radioName" value="Option1"> Option1
<input type="radio" name="radioName" value="Option2" checked> Option2
<input type="radio" name="radioName" value="Option3"> Option3
</form>
Jquery
$(document).ready(function() {
$('input[name="radioName"]').on('change', function() {
const val = $(this).filter(":checked").val();
alert(val);
})
// First load check
const val = $('input[name="radioName"]').filter(":checked").val();
alert(val);
});
要检索 JavaScript 数组中的所有单选按钮值，请使用以下 jQuery 代码：
var values = jQuery('input:checkbox:checked.group1').map(function () {
return this.value;
}).get();
尝试一下-
var radioVal = $("#myform").find("input[type='radio']:checked").val();
console.log(radioVal);
另一种获取方式：
$("#myForm input[type=radio]").on("change",function(){
if(this.checked) {
alert(this.value);
}
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="myForm">
<span><input type="radio" name="q12_3" value="1">1</span><br>
<span><input type="radio" name="q12_3" value="2">2</span>
</form>从这个问题，我想出了另一种方法来访问当前选择的
inputclickinputlabelTL；博士
$('label').click(function() {
var selected = $('#' + $(this).attr('for')).val();
...
});
$(function() {
// this outright does not work properly as explained above
$('#reported label').click(function() {
var query = $('input[name="filter"]:checked').val();
var time = (new Date()).toString();
$('.query[data-method="click event"]').html(query + ' at ' + time);
});
// this works, but fails to update when same label is clicked consecutively
$('#reported input[name="filter"]').on('change', function() {
var query = $('input[name="filter"]:checked').val();
var time = (new Date()).toString();
$('.query[data-method="change event"]').html(query + ' at ' + time);
});
// here is the solution I came up with
$('#reported label').click(function() {
var query = $('#' + $(this).attr('for')).val();
var time = (new Date()).toString();
$('.query[data-method="click event with this"]').html(query + ' at ' + time);
});
});input[name="filter"] {
display: none;
}
#reported label {
background-color: #ccc;
padding: 5px;
margin: 5px;
border-radius: 5px;
cursor: pointer;
}
.query {
padding: 5px;
margin: 5px;
}
.query:before {
content: "on " attr(data-method)": ";
}
[data-method="click event"] {
color: red;
}
[data-method="change event"] {
color: #cc0;
}
[data-method="click event with this"] {
color: green;
}�
755e
�\n"<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="reported">
<input type="radio" name="filter" id="question" value="questions" checked="checked">
<label for="question">Questions</label>
<input type="radio" name="filter" id="answer" value="answers">
<label for="answer">Answers</label>
<input type="radio" name="filter" id="comment" value="comments">
<label for="comment">Comments</label>
<input type="radio" name="filter" id="user" value="users">
<label for="user">Users</label>
<input type="radio" name="filter" id="company" value="companies">
<label for="company">Companies</label>
<div class="query" data-method="click event"></div>
<div class="query" data-method="change event"></div>
<div class="query" data-method="click event with this"></div>
</form>