javascriptを使用してチェックされたラジオボタンの値を取得する

JavaScriptのjQueryを使用せずにフォームのラジオボタンの値にアクセスしようとしています。私はこれを見て多くの答えを見ましたが、同じコードを私のプロジェクトにコピーすると何らかの理由でうまく動作しません。ここに私のコードです。javascriptを使用してチェックされたラジオボタンの値を取得する

<form> 
    <input type="radio" name="style" value="3" checked> 
    <input type="radio" name="style" value="5"> 
    <input type="radio" name="style" value="10"> 
</form>

私はこのJavaScriptコードを使用して値にアクセスしようとしました：

var value = document.querySelector('input[name="style"]:checked').value; 
console.log(value);

私はこれが私にログインした値として、3の文字列を与えるだろうと仮定します。私はこの例をしようとすると、私は次のエラーを取得する：

request.js:1 Uncaught TypeError: Cannot read property 'value' of null 
    at request.js:1

は、私はまた、スタイルを名前の入力の配列のforループを使用してみました、それはどちらか動作しませんでした。 3つの入力がすべて見つかりましたが、配列の値はありませんでした。誰かが間違っていることを説明できますか？これが明白であれば、私はまだ勉強しているだけで、より良くなるよう努力しています。

出典

2017-07-15 Travis Alexander Terrell

それは – Daniel

あなたのコードは、私の作品（HTMLをコピーして、 ''

あなたのコードの後に最新の値を取得するためにイベントを必要とする以外のコードは、正常に動作している正しいです、あなただけの必要にセレクタコードを実行するためのイベントです選択した値の値を取得します。以下のコードを参照してください： - onclickイベントハンドラの関数配置の代わりにclickイベントのjavascriptセレクタを使用することもできます。


 
function run_test(){ 
 
     
 
    var radio_ele = document.querySelector('input[name="style"]:checked'); 
 
    console.log(radio_ele.value); 
 

 
}

<form> 
 
    <input type="radio" name="style" value="3"> 
 
    <input type="radio" name="style" value="5"> 
 
    <input type="radio" name="style" value="10"> 
 
    <button type="button" onclick="run_test()">click</button> 
 
</form>

出典

2017-07-15 18:17:17

javascriptを使用してチェックされたラジオボタンの値を取得する

関連する問題