根據所選單選按鈕顯示一則提示消息

我正在爲探路者活動創建角色扮演遊戲問卷。我想根據他們如何回答上面列出的問題，創造一種給玩家角色各種獎金的方式。我打算調整下面的內容，我只需要知道如何編寫顯示爲每個問題選擇的輸入單選按鈕值的代碼。根據所選單選按鈕顯示一則提示消息

下面是代碼：

<!DOCTYPE html> 
<html> 
<script> 

function myFunction() 
{ 
var queone = document.getElementById("qone").value; 
var quetwo = document.getElementById("qtwo").value; 
var quethr = document.getElementById("qthr").value; 

if (queone == 1) { 
alert("You are now +2 Acrobatics"); 
} 
else if (queone == 2) { 
alert("You are now +2 to Bluff"); 
} 
else if (queone == 3) { 
alert("You are now +2 Diplomacy"); 
} 

if (quetwo == 1) { 
alert("You are now +2 Acrobatics"); 
} 
else if (quetwo == 2) { 
alert("You are now +2 to Bluff"); 
} 
else if (quetwo == 3) { 
alert("You are now +2 Diplomacy"); 
} 

if (quethr == 1) { 
alert("You are now +2 Acrobatics"); 
} 
else if (quethr == 2) { 
alert("You are now +2 to Bluff"); 
} 
else if (quethr == 3) { 
alert("You are now +2 Diplomacy"); 
} 
} 
</script> 

<div> 



<h2 align="center">Fantasy Survey</h2> 
<p>Do you love fantasy games?</p></br></br> 
<input id="qone" name="radio1" value="1" checked="" type="radio">Yes</br></br> 
<input id="qone" name="radio1" value="2" type="radio">Meh</br></br> 
<input id="qone" name="radio1" value="3" type="radio">No</br></br> 
<p>Have you ever considered playing pen and paper games?</p></br></br> 
<input id="qtwo" name="radio2" value="1" checked="" type="radio"> Yes</br></br> 
<input id="qtwo" name="radio2" value="2" type="radio"> Meh</br></br> 
<input id="qtwo" name="radio2" value="3" type="radio"> No</br></br> 
<p>Do you like Pathfinder?</p></br></br> 
<input id="qthr" name="radio3" value="1" checked="" type="radio"> Yes</br></br> 
<input id="qthr" name="radio3" value="2" type="radio"> Meh</br></br> 
<input id="qthr" name="radio3" value="3" type="radio"> No</br></br> 
<input type="button" onclick="myFunction()" value="Submit" /> 


</div> 
</html>

我在尋找與這取決於他們通過單選按鈕值做出什麼選擇的字符獎金時顯示一個警告。我覺得我很接近，但我不知道如何只提醒與選定的特定單選按鈕相關的值。如果你有更好的方法，我很高興聽到它，但我希望能夠完成與我上面發佈的內容類似的內容。

感謝您的時間！

來源

2013-10-01 Bonedaddy

這真不明白你問什麼。你想要一個警報來說明所有三個選項？ – drewish

所有IDS首先必須unique.So需要被corrected.Change那些並嘗試jQuery的selectors.If你是新來這個腳本語言，我會建議您嘗試this

這裏是工作代碼

var queone = $("input[type='radio'][name='radio1']").val(); 
var quetwo = $("input[type='radio'][name='radio2']").val(); 
var quethree = $("input[type='radio'][name='radio3']").val(); 

if (queone == 1) { 
    alert("You are now +2 Acrobatics"); 
} 
else if (queone == 2) { 
    alert("You are now +2 to Bluff"); 
} 
else if (queone == 3) { 
alert("You are now +2 Diplomacy"); 
} 

if (quetwo == 1) { 
    alert("You are now +2 Acrobatics"); 
} 
else if (quetwo == 2) { 
    alert("You are now +2 to Bluff"); 
} 
else if (quetwo == 3) { 
    alert("You are now +2 Diplomacy"); 
} 

if (quethree == 1) { 
    alert("You are now +2 Acrobatics"); 
    } 
else if (quethree == 2) { 
    alert("You are now +2 to Bluff"); 
} 
else if (quethree == 3) { 
    alert("You are now +2 Diplomacy"); 
}

來源

2013-10-01 05:54:08 renacimiento

首先，你給不同的元素相同的id值。對於所有元素，id屬性應該是唯一的。在你的情況下，getElementById將始終返回它遇到的第一個項目，不一定是選定的項目。

你可以做的是使用querySelector函數，它應該從IE8向上工作，並在所有其他瀏覽器中工作。

document.querySelector("input[name=radio1]:checked")應該返回正確的項目。

你總是可以看看jQuery作爲一個有用的庫，但它不是需要這一點。

來源

2013-10-01 05:56:42 Kippie

您可以使用此代碼

<!DOCTYPE html> 
<html> 
<script> 

function myFunction() 
{ 
    for(k=1; k<=3; k++) 
     checkVal(document.getElementsByName("radio"+k))  

} 

function checkVal(selector){ 
for (var i = 0; i < selector.length; i++) {  
     if (selector[i].checked) { 
      switch (selector[i].value){ 
       case '1' : 
        alert("You are now +2 Acrobatics") 
        break; 
       case '2' : 
        alert("You are now +2 to Bluff") 
        break; 
       case '3' : 
        alert("You are now +2 Diplomacy") 
        break; 

       } 

      break; 

     } 
    } 
} 
</script> 

<div> 
    <h2 align="center">Fantasy Survey</h2> 
    <p>Do you love fantasy games?</p></br></br> 
    <input name="radio1" value="1" checked="" type="radio">Yes</br></br> 
    <input name="radio1" value="2" type="radio">Meh</br></br> 
    <input name="radio1" value="3" type="radio">No</br></br> 
    <p>Have you ever considered playing pen and paper games?</p></br></br> 
    <input name="radio2" value="1" checked="" type="radio">Yes</br></br> 
    <input name="radio2" value="2" type="radio">Meh</br></br> 
    <input name="radio2" value="3" type="radio">No</br></br> 
    <p>Do you like Pathfinder?</p></br></br> 
    <input name="radio3" value="1" checked="" type="radio">Yes</br></br> 
    <input name="radio3" value="2" type="radio">Meh</br></br> 
    <input name="radio3" value="3" type="radio">No</br></br> 
    <input type="button" onclick="myFunction()" value="Submit" /> 
</div> 
</html>

來源

2013-10-01 06:40:26

根據所選單選按鈕顯示一則提示消息

回答

相關問題