選択したラジオ入力を確認したい。
これが私のコードです。
<input name="u_type" type="radio" value="staff" id="u_type" checked="checked" /> Staff
<input name="u_type" type="radio" value="admin" id="u_type" /> Admin
<input id="add_user" name="add_user" type="button" onclick="addUser();" value="Add" class="submitButton admin_add" />
function addUser()
{
//how to check what is the selected radio input
}
ありがとう。
function addUser() {
//how to check what is the selected radio input
alert(getCheckedRadioValue('u_type'));
}
function getCheckedRadioValue(name) {
var elements = document.getElementsByName(name);
for (var i=0, len=elements.length; i<len; ++i)
if (elements[i].checked) return elements[i].value;
}
また、要素のIDは異なっている必要があります。
JQueryを使用せずに、チェックされたラジオボタンの値を取得するには:
var radios = document.getElementsByName("u_type");
for(var i = 0; i < radios.length; i++) {
if(radios[i].checked) selectedValue = radios[i].value;
}
(selectedValue
が他の場所で宣言された変数であると仮定します)
$('input[name=u_type]:checked').val()
選択したオプションの値を取得します。もちろん、変数に割り当てることができます。注意点として、これはjqueryであり、DOM操作を簡単にし、ブラウザー間の互換性に優れた便利なjavascriptライブラリであることも指摘しておく必要があります。それは見つけることができます ここ 。
Kmb385の提案の代わりに、入力をフォームでラップし、すべての入力名が異なる(2つのu_typeがある)名前であることを確認することもできます。
次に、document.formname.inputname.checked
として入力にアクセスできます。これにより、trueまたはfalseが返されます。
これは古い質問だと思いますが、答えは複雑すぎるようです。
前に指摘したように、同じIDを持つ2つの要素を使用しないでください。これはhtml仕様に違反しています。 id属性を削除するか、2つの異なる値にします。次に、これを使用してチェック値を取得します。
document.querySelector("input[type='radio'][name='u_type']:checked").value
同じIDを持つ2つの無線要素を使用しないでください。 IDの1つを変更してから、次のように両方のラジオボタンを確認する必要があります。
if(document.getElementById("u_type").checked == true)
{
//do something
}
ネイティブjsの代わりにjqueryを使用してこれを行うことをお勧めします。