jQueryでラジオオプションのオンロードを設定する方法


Answers

1つのライナーはいかがですか?

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

jQueryでラジオオプションをオンロードする方法を設定するには?

デフォルトが設定されていないかどうかを確認してから、デフォルトを設定する




// JavaScriptやバックボーンのようなフレームワークでこれをやっているのなら、このようなことがたくさんあるでしょう

$MobileRadio = $( '#mobileUrlRadio' );

while

$MobileRadio.checked = true;

動作しないでしょう、

$MobileRadio[0].checked = true;

意志。

あなたのセレクターは上記の他の人と同様に推薦することができます。




モデルから値を渡して、値に基づいてロード時にグループからラジオボタンを選択する場合は、次のようにします。

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>



ネイティブ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



JQueryは実際にラジオとチェックボックスのチェック状態を設定する2つの方法を持っていますが、HTMLマークアップでvalue属性を使用しているかどうかによって異なります。

それらが値属性を持つ場合:

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

値属性を持たない場合:

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

詳細

最初のケースでは、名前を使用してラジオグループ全体を指定し、JQueryにval関数を使用して選択するラジオを見つけるように指示します。 val関数は1要素の配列をとり、一致する値を持つラジオを見つけ、checked = trueに設定します。 同じ名前の他のものは選択解除されます。 値が一致するラジオが見つからない場合、すべての選択が解除されます。 同じ名前と値のラジオが複数ある場合は、最後のラジオが選択され、他は選択解除されます。

ラジオの値属性を使用していない場合は、グループ内の特定のラジオを選択するために一意のIDを使用する必要があります。 この場合、prop関数を使用して "checked"プロパティを設定する必要があります。 多くの人がチェックボックスで値属性を使用しないので、#2はチェックボックスとラジオに適用されます。 同じ名前のチェックボックスはグループ化されないので、 $("[name=myCheckBox").prop("checked", true);実行できます$("[name=myCheckBox").prop("checked", true); チェックボックスのために。

このコードで遊ぶことができます: http://jsbin.com/OSULAtu/1/edit?html,output : http://jsbin.com/OSULAtu/1/edit?html,output




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



私はあなたが推測できると思う、その名前はユニークであり、グループのすべてのラジオは同じ名前を持っています。 次に、jQueryのサポートを使用することができます:

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

注:配列を渡すことは重要です。

条件付きバージョン:

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