Question

如何使用jQuery设置onload选中onload？

需要检查是否未设置默认值，然后设置默认值

Answer 1

假设您有这样的单选按钮，例如：

<input type='radio' name='gender' value='Male'>
<input type='radio' name='gender' value='Female'>

如果没有检查无线电，你想检查一个值为“Male”onload的那个：

$(function() {
    var $radios = $('input:radio[name=gender]');
    if($radios.is(':checked') === false) {
        $radios.filter('[value=Male]').prop('checked', true);
    }
});

Answer 2

一个班轮怎么样？

$('input:radio[name="gender"]').filter('[value="Male"]').attr('checked', true);

Answer 3

这个会导致form.reset（）失败：

$('input:radio[name=gender][value=Male]').attr('checked', true);

但是这个有效：

$('input:radio[name=gender][value=Male]').click();

Answer 4

JQuery实际上有两种方法来设置无线电和复选框的已检查状态，这取决于您是否在HTML标记中使用值属性：

如果他们有值属性：

$("[name=myRadio]").val(["myValue"]);

如果他们没有值属性：

$("#myRadio1").prop("checked", true);

更多细节

在第一种情况下，我们使用名称指定整个无线电组，并告诉JQuery使用val函数查找要选择的无线电。 val函数采用1元素数组并找到具有匹配值的无线电，设置其checked = true。其他具有相同名称的将被取消选择。如果找不到具有匹配值的无线电，则将取消选择所有无线电。如果有多个具有相同名称和值的无线电，则将选择最后一个，并取消选择其他无线电。

如果您没有使用无线电的值属性，则需要使用唯一ID来选择组中的特定无线电。在这种情况下，您需要使用prop函数来设置“checked”属性。许多人不使用带有复选框的值属性，因此＃2更适用于复选框，然后是无线电。另请注意，由于复选框在具有相同名称时不会形成组，因此您可以$("[name=myCheckBox").prop("checked", true);选中复选框。

您可以在此处使用此代码：http://jsbin.com/OSULAtu/1/edit?html,output

Answer 5

我喜欢@Amc的答案。我发现表达式可以进一步浓缩，不使用filter（）调用（@chaiko显然也注意到了这一点）。此外，prop（）是jQuery v1.6 +与attr（）相关的方法，请参阅jQuery documentation for prop()了解该主题的官方最佳实践。

从@Paolo Bergantino的答案中考虑相同的输入标签。

<input type='radio' name='gender' value='Male'>
<input type='radio' name='gender' value='Female'>

更新后的单行内容可能如下所示：

$('input:radio[name="gender"][value="Male"]').prop('checked', true);

Answer 6

我认为您可以假设，该名称是唯一的，并且组中的所有无线电都具有相同的名称。然后你可以使用这样的jQuery支持：

$("[name=gender]").val(["Male"]);

注意：传递数组非常重要。

条件版本：

if (!$("[name=gender]:checked").length) {
    $("[name=gender]").val(["Male"]);
}

Answer 7

如果您希望它真正动态并选择与传入数据相对应的无线电，则此方法有效。它使用传入的数据的性别值或使用默认值。

if(data['gender'] == ''){
 $('input:radio[name="gender"][value="Male"]').prop('checked', true);
}else{
  $('input:radio[name="gender"][value="' + data['gender'] +'"]').prop('checked', true);
};

Answer 8

原生JS解决方案：

 document.querySelector('input[name=gender][value=Female]').checked = true;

http://jsfiddle.net/jzQvH/75/

HTML：

<input type='radio' name='gender' value='Male'> Male
<input type='radio' name='gender' value='Female'>Female

Answer 9

如果您想从模型中传递一个值，并希望根据值选择加载组中的单选按钮，而不是使用：

Jquery的：

var priority = Model.Priority; //coming for razor model in this case
var allInputIds = "#slider-vertical-" + itemIndex + " fieldset input";

$(allInputIds).val([priority]); //Select at start up

和html：

<div id="@("slider-vertical-"+Model.Id)">
 <fieldset data-role="controlgroup" data-type="horizontal" data-mini="true">
    <input type="radio" name="@("radio-choice-b-"+Model.Id)" id="@("high-"+Model.Id)" value="1" checked="checked">
    <label for="@("high-"+Model.Id)" style="width:100px">@UIStrings.PriorityHighText</label>

    <input type="radio" name="@("radio-choice-b-"+Model.Id)" id="@("medium-"+Model.Id)" value="2">
    <label for="@("medium-"+Model.Id)" style="width:100px">@UIStrings.PriorityMediumText</label>

    <input type="radio" name="@("radio-choice-b-"+Model.Id)" id="@("low-"+Model.Id)" value="3">
    <label for="@("low-"+Model.Id)" style="width:100px">@UIStrings.PriorityLowText</label>
 </fieldset>
</div>

Answer 10

不需要这一切。使用简单和旧的HTML，您可以实现您想要的。如果您默认选中要收听的收音机，请执行以下操作：
<input type='radio' name='gender' checked='true' value='Male'>
当页面加载时，它将被检查。

Answer 11

 $("form input:[name=gender]").filter('[value=Male]').attr('checked', true);

Answer 12

以上是上述方法的示例：

<div class="ui-field-contain">
<fieldset data-role="controlgroup" data-type="horizontal">    <legend>Choose a pet:</legend>
    <input type="radio" name="radio-choice-2" id="radio-choice-1" value="choice1">
    <label for="radio-choice-1">Cat</label>

    <input type="radio" name="radio-choice-2" id="radio-choice-2" value="choice2">
    <label for="radio-choice-2">Dog</label>

    <input type="radio" name="radio-choice-2" id="radio-choice-3" value="choice3">
    <label for="radio-choice-3">Hamster</label>

    <input type="radio" name="radio-choice-2" id="radio-choice-4" value="choice4">
    <label for="radio-choice-4">Lizard</label>
  </fieldset>
</div>

在javascript中：

$("[name = 'radio-choice-2'][value='choice3']").prop('checked', true).checkboxradio('refresh');

Answer 13

获取无线电输入值时请注意此行为：

$('input[name="myRadio"]').change(function(e) { // Select the radio input group

    // This returns the value of the checked radio button
    // which triggered the event.
    console.log( $(this).val() ); 

    // but this will return the first radio button's value,
    // regardless of checked state of the radio group.
    console.log( $('input[name="myRadio"]').val() ); 

});

所以$('input[name="myRadio"]').val()没有像你期望的那样返回无线电输入的检查值 - 它返回第一个单选按钮的值。

Answer 14

De esta forma Jquery obtiene solo el elemento check

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

Answer 15

//如果你是在javascript或像骨干这样的框架上做的，你会遇到很多你可以有这样的东西

$MobileRadio = $( '#mobileUrlRadio' );

，而

$MobileRadio.checked = true;

不起作用，

$MobileRadio[0].checked = true;

意愿。

您的选择器也可以像上面推荐的其他人一样。

Answer 16

这适用于多个单选按钮

$('input:radio[name="Aspirant.Gender"][value='+jsonData.Gender+']').prop('checked', true);

如何使用jQuery设置无线电选项onload

16 个答案:

如果他们有值属性：

如果他们没有值属性：

更多细节