web-dev-qa-db-ja.com

異なる名前で相互に排他的なラジオボタンを作成するにはどうすればよいですか？

同じカテゴリに属する​​ラジオボタンがいくつかありますが、名前を変えて相互に排他的にしたいと思います。それ、どうやったら出来るの？選択した値に基づいて、さまざまなアクションを実行しますが、同じ名前の場合はアクセスできません。

javascripthtmlradio-button
17
yogsma

同じ名前の場合、なぜアクセスできないのですか？ IDを追加できます（必要です）、値で区別するか、IDを数えてn番目の要素を使用できます。

あなたラジオボタンに同じ名前を付ける必要がありますブラウザにそれらが排他的であることを理解させるために。

これをハックして、各オブジェクトに異なる名前を付けることができます（ただし、そうすべきではありません）。次に、オブジェクトごとにonSelect/onClickハンドラーを追加し、イベントが発生したら、他のボタンの「チェックを外します」。これは汚れているので避けてください。

27
Konerak

ラジオボタンは、相互に排他的であるために同じ名前を必要とします。ただし、JavaScriptを使用して個別に操作する場合は、ID属性値を変えることができます。

JQueryで選択した値を取得する方法はたくさんあります。

<input type="radio" name="foo" value="1" />
<input type="radio" name="foo" value="2" />


// value of checked input tag of type 'radio'
var selectedValue = $('input[type=radio]:checked').val();

// value of checked input tag having name of 'foo'
var selectedValue = $('input[name=foo]:checked').val();

// value of the first checked radio button, regardless of name
var selectedValue = $('input:checked').val();
14
a7drew

名前を変更する必要がある場合は、JavaScriptを介してDOMとその要素にアクセスできます。

<input type="checkbox" name="X" id="myElement" />

<script>   document.getElementById('myElement').name = 'text'; </script>

http://www.w3schools.com/JS/js_ex_dom.asp

0
Greg McNulty