【JavaScript】form の radio ボタンをJSで取得する
form の radio ボタンをJSで取得する場合、RadioNodeList を利用すると、簡単に取得できます。
<form id="radio_ex" action="./form.php"> <input type="radio" name="plusone" value="aaa">選択肢1 <input type="radio" name="plusone" value="bbb">選択肢2 <input type="radio" name="plusone" value="ccc" checked>選択肢3 <input type="radio" name="plusone" value="ddd">選択肢4 </form>
// form要素を取得
let element = document.getElementById( "radio_ex" ) ;
// RadioNodeListを取得
let elements = element.plusone ; // RadioNodeList
// HTMLOptionsCollectionの内容
console.log( elements[0] ) ; // 選択肢1
console.log( elements[1] ) ; // 選択肢2
console.log( elements[2] ) ; // 選択肢3
console.log( elements[3] ) ; // 選択肢4
// 現在、選択されている値を取得
console.log( elements.value ) ; // "ccc" (例)
//チェックを付ける
elements[0].ckecked = true;
//チェックを外す
elements[0].ckecked = false;
使用例
＜対応ブラウザ＞
・メジャーブラウザはほぼ全て対応しています。
Can I use
