Проверка javascript, какая форма радио была выбрана

Question

Я пытаюсь сделать собачью гонку. В основном, я хочу проверить, что радио проверено пользователем, сравнить его с случайным числом от 1 до 5 и посмотреть, выиграл ли он.

Мой вопрос ... Как их сравнить?

Это мой код.

function chooser(){ 
    var theDogs = ["dog1","dog2","dog3","dog4","dog5"], 

    rand = theDogs[Math.floor(Math.random() * theDogs.length)]; 

    document.getElementById("winner").innerHTML = rand; 


if(pick == rand) 
    {document.getElementById("winner").innerHTML =("win!");} 
     else { 
      document.getElementById("winner").innerHTML =("loose"); 
     } 
    } 

HTML:

<form id="pick" action="rand"> 
<input type="radio" name="dog" id="dog1">Dog1<br> 
<input type="radio" name="dog" id="dog2">Dog2<br> 
<input type="radio" name="dog" id="dog3">Dog3<br> 
<input type="radio" name="dog" id="dog4">Dog4<br> 
<input type="radio" name="dog" id="dog5">Dog5<br> 
</form> 

<br> 
<br> 
     <input type="submit" value="Gamble" onclick="chooser();"> 
<br> 

<p id="winner"> </p> 

Answer 1

JQuery и собственный подход к JavaScript. Выбирайте.

$("#submitjq").click(function() { 
 
     var theDogs = ["dog1","dog2","dog3","dog4","dog5"], 
 

 
     rand = theDogs[Math.floor(Math.random() * theDogs.length)]; 
 

 
     var pick = $("input[type=radio][name='dog']:checked").val(); 
 
     if(pick == rand) 
 
     { 
 
      $("#winner").html("jQuery: Won!"); 
 
     } 
 
     else { 
 
      $("#winner").html("jQuery: Lost!"); 
 
     } 
 
}); 
 
    
 
document.getElementById('submitjs').onclick = function() { 
 
\t \t \t var theDogs = ["dog1","dog2","dog3","dog4","dog5"], 
 

 
     rand = theDogs[Math.floor(Math.random() * theDogs.length)]; 
 

 
     var pick = document.pick.dog.value; 
 
     console.log(pick); 
 
     if(pick == rand) 
 
     { 
 
      document.getElementById("winner").innerHTML = "JavaScript: Won!" ; 
 
     } 
 
     else { 
 
      document.getElementById("winner").innerHTML = "JavaScript: Lost!" ; 
 
     } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form id="pick" name="pick" action="rand"> 
 
<input type="radio" name="dog" value="dog1">Dog1<br> 
 
<input type="radio" name="dog" value="dog2">Dog2<br> 
 
<input type="radio" name="dog" value="dog3">Dog3<br> 
 
<input type="radio" name="dog" value="dog4">Dog4<br> 
 
<input type="radio" name="dog" value="dog5">Dog5<br> 
 
</form> 
 

 
<br> 
 
<br> 
 
     <input type="submit" id="submitjs" value="Gamble Native JavaScript" /> 
 
     <input type="submit" id="submitjq" value="Gamble jQuery" /> 
 
<br> 
 

 
<p id="winner"> </p>

Answer 2

Вы должны дать каждой кнопку RADIO значения, а затем getElementsByName, перебор, чтобы найти тот, который проверяется. See similar thread...