jQueryやJavaScriptでシンプルなクイズが動作しない

「送信」ボタンを送信したときに、正しい質問の数を回答する簡単なクイズを作成しています。しかし、常にゼロを与えています。 Plsヘルプ。jQueryやJavaScriptでシンプルなクイズが動作しない

$(document).ready(function(){ 
 
$('button').click(function(){ 
 
\t var count = 0; 
 
\t if($('[name=q1]').val() == "Delhi"){count++;} 
 
\t if($('[name=q2]').val() == "Lotus"){count++;} 
 
\t alert(count); 
 
}); 
 
});

<body> 
 

 
<div> 
 
<p>Question: What is capital of India?</p> 
 

 
<input type="radio" name="q1" value="delhi"> Delhi 
 
<input type="radio" name="q1" value="mumbai"> Mumbai 
 
<input type="radio" name="q1" value="kolkata"> Kolkata 
 
<input type="radio" name="q1" value="lucknow"> Lucknow 
 
</div> 
 

 
<div> 
 
<p>Question: What is the national flower of India?</p> 
 

 
<input type="radio" name="q2" value="rose"> Rose 
 
<input type="radio" name="q2" value="lotus"> Lotus 
 
<input type="radio" name="q2" value="sunflower"> Sunflower 
 
<input type="radio" name="q2" value="tulip"> Tulip 
 
</div> 
 

 
<button>submit</button> 
 

 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 

 
</body>

それは常に '0' を与えているが、私は 'デリー' と 'ロータス' を選択した場合、それは、ような答えを与える必要があります。

出典

2017-02-16 Deadpool

あなたは答えを小文字で「値」に入力しましたが、最初の読みを大文字で制御しました –

2つのこと：

$('[name=q1]').val()はあなたname="q1"と最初要素の値を与える、ないは要素をチェックします。そのためには、:checkedを追加してください。
"delhi"と"Delhi"を比較しています。大事な事柄。

$(document).ready(function() { 
 
    $('button').click(function() { 
 
    var count = 0; 
 
    if ($('[name=q1]:checked').val() == "delhi") { 
 
     count++; 
 
    } 
 
    if ($('[name=q2]:checked').val() == "lotus") { 
 
     count++; 
 
    } 
 
    alert(count); 
 
    }); 
 
});

<div> 
 
    <p>Question: What is capital of India?</p> 
 

 
    <input type="radio" name="q1" value="delhi"> Delhi 
 
    <input type="radio" name="q1" value="mumbai"> Mumbai 
 
    <input type="radio" name="q1" value="kolkata"> Kolkata 
 
    <input type="radio" name="q1" value="lucknow"> Lucknow 
 
</div> 
 

 
<div> 
 
    <p>Question: What is the national flower of India?</p> 
 

 
    <input type="radio" name="q2" value="rose"> Rose 
 
    <input type="radio" name="q2" value="lotus"> Lotus 
 
    <input type="radio" name="q2" value="sunflower"> Sunflower 
 
    <input type="radio" name="q2" value="tulip"> Tulip 
 
</div> 
 

 
<button>submit</button> 
 

 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

出典

2017-02-16 09:30:18

正しい答えです。 :)ありがとう – Deadpool

あなたのJSコード内のエラーを持って、そしてあなたがチェックの入力を選択する必要があり、あなたのコードは、単に最初の入力

$(document).ready(function(){ 
 
    $('button').click(function(){ 
 
\t  var count = 0; 
 
\t  if($('input[name=q1]:checked').val() == "delhi"){count++;} 
 
\t  if($('input[name=q2]:checked').val() == "lotus"){count++;} 
 
\t  alert(count); 
 
    }); 
 
});

<body> 
 

 
    <div> 
 
     <p>Question: What is capital of India?</p> 
 

 
     <input type="radio" name="q1" value="delhi"> Delhi 
 
     <input type="radio" name="q1" value="mumbai"> Mumbai 
 
     <input type="radio" name="q1" value="kolkata"> Kolkata 
 
     <input type="radio" name="q1" value="lucknow"> Lucknow 
 
    </div> 
 

 
    <div> 
 
     <p>Question: What is the national flower of India?</p> 
 

 
     <input type="radio" name="q2" value="rose"> Rose 
 
     <input type="radio" name="q2" value="lotus"> Lotus 
 
     <input type="radio" name="q2" value="sunflower"> Sunflower 
 
     <input type="radio" name="q2" value="tulip"> Tulip 
 
    </div> 
 

 
    <button>submit</button> 
 

 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js">      </script> 
 

 
</body>

を選択

出典

2017-02-16 09:32:32

$(document).ready(function(){ 
 
$('button').click(function(){ 
 
\t var count = 0; 
 
if($('[name=q1]:checked').val() == "delhi"){count++;} 
 
if($('[name=q2]:checked').val() == "lotus"){count++;} 
 
\t alert(count); 
 
}); 
 
});

<body> 
 

 
<div> 
 
<p>Question: What is capital of India?</p> 
 

 
<input type="radio" name="q1" value="delhi"> Delhi 
 
<input type="radio" name="q1" value="mumbai"> Mumbai 
 
<input type="radio" name="q1" value="kolkata"> Kolkata 
 
<input type="radio" name="q1" value="lucknow"> Lucknow 
 
</div> 
 

 
<div> 
 
<p>Question: What is the national flower of India?</p> 
 

 
<input type="radio" name="q2" value="rose"> Rose 
 
<input type="radio" name="q2" value="lotus"> Lotus 
 
<input type="radio" name="q2" value="sunflower"> Sunflower 
 
<input type="radio" name="q2" value="tulip"> Tulip 
 
</div> 
 

 
<button>submit</button> 
 

 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 

 
</body>

出典

2017-02-16 09:47:13

あなたは、ユーザーによってチェックされているラジオボタンの値を探す必要があります。コードの大文字と小文字の区別を確認してください –

答えを説明する説明を追加してください。 – jjj

あなたは大文字（蓮=>ロータスなど）を使用して値名前を変更してください。

出典

2017-02-16 10:14:31 Mefimefi

jQueryやJavaScriptでシンプルなクイズが動作しない

答えて

関連する問題