檢索圖像中選定的單選按鈕值

我想根據用戶選擇顯示單選按鈕值，但警報時我沒有獲取值。我也想作爲圖像來顯示單選按鈕的值..像當用戶選擇男男然後PIC顯示檢索圖像中選定的單選按鈕值

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Document</title> 
</head> 
<body> 
<form id="test"> 
<h4>Gender</h4> 
    <input type="radio" name="gender" value="male"> Male<br> 
    <input type="radio" name="gender" value="female"> Female<br> 
    <h4>Occupation</h4> 
    <input type="radio" name="occupation" value="PvtJob">Pvt. Job<br> 
    <input type="radio" name="occupation" value="Govt">Govt. Employee<br> 
    <h4>Loan Type</h4> 
    <input type="radio" name="loan" value="Personal">Personal Loan<br> 
    <input type="radio" name="loan" value="Health">Health Loan<br><br> 
<button class="btn btn-primary pull-right place-order-button" name="submit" value="submit" onclick="return myFunction()" type="submit" >Finish</button> 
</form> 
</body> 
<script type="text/javascript"> 
    function myFunction() { 
     var radioButtons =["gender","occupation","loan"]; 

     for(var x = 0; x < radioButtons.length; x ++) { 
      if ($('input[name = "'+radioButtons[x]+'"]:checked','#test').val()) { 
       alert("You checked " + $('input[name = "'+radioButtons[x]+'"]:checked','#test').attr('id')); 
       alert("Value is " + $('input[name = "'+radioButtons[x]+'"]:checked','#test').val()); 
     } 
    } 
} 
</script> 
</html>

來源

2016-09-19 nady gold

這是需要在單擊按鈕或單選按鈕，單擊？ – Samir

如果情況不正確，我認爲你。 – Samir

你需要添加引用jQuery庫 – Satpal

在代碼中包括jQuery和有鼻涕屬性，在輸入提到的id。您的代碼中也沒有諸如測試等id。您也不需要再次重複選擇器，您可以簡單使用$(this)

請嘗試下面的代碼片段。

function myFunction() { 
 
     var radioButtons =["gender","occupation","loan"]; 
 

 
     for(var x = 0; x < radioButtons.length; x ++) { 
 
      if ($('input[name = "'+radioButtons[x]+'"]:checked').val()) { 
 
       alert("Value is " + $(this).val()); 
 
     } 
 
    } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<body> 
 
<form id="test"> 
 
<h4>Gender</h4> 
 
    <input type="radio" name="gender" value="male"> Male<br> 
 
    <input type="radio" name="gender" value="female"> Female<br> 
 
    <h4>Occupation</h4> 
 
    <input type="radio" name="occupation" value="PvtJob">Pvt. Job<br> 
 
    <input type="radio" name="occupation" value="Govt">Govt. Employee<br> 
 
    <h4>Loan Type</h4> 
 
    <input type="radio" name="loan" value="Personal">Personal Loan<br> 
 
    <input type="radio" name="loan" value="Health">Health Loan<br><br> 
 
<button class="btn btn-primary pull-right place-order-button" name="submit" value="submit" onclick="return myFunction()" type="submit" >Finish</button> 
 
</form> 
 
</body>

來源

2016-09-19 11:00:01

由於您使用jQuery的功能，你需要在你的頭添加jQuery庫。請以標題部分添加

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

，並嘗試

來源

2016-09-19 11:01:04

您可以使用length proprty對象的檢查所選元素。還在您的HTML頁面中添加jQuery庫路徑。

function myFunction() { 
 
     var radioButtons =["gender","occupation","loan"]; 
 

 
     for(var x = 0; x < radioButtons.length; x ++) { 
 
      selected=$('input[name = "'+radioButtons[x]+'"]:checked','#test'); 
 
      if (selected.length>0) { 
 
       
 
       alert(radioButtons[x] + ":: Value is " + selected.val()); 
 
     } 
 
    } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
 
<form id="test"> 
 
<h4>Gender</h4> 
 
    <input type="radio" name="gender" value="male" id=""> Male<br> 
 
    <input type="radio" name="gender" value="female"> Female<br> 
 
    <h4>Occupation</h4> 
 
    <input type="radio" name="occupation" value="PvtJob">Pvt. Job<br> 
 
    <input type="radio" name="occupation" value="Govt">Govt. Employee<br> 
 
    <h4>Loan Type</h4> 
 
    <input type="radio" name="loan" value="Personal">Personal Loan<br> 
 
    <input type="radio" name="loan" value="Health">Health Loan<br><br> 
 
<button class="btn btn-primary pull-right place-order-button" name="submit" value="submit" onclick="return myFunction()" type="submit" >Finish</button> 
 
</form>

來源

2016-09-19 11:04:59

你正在正確的方式..但我想顯示選定的值作爲像選擇男性的div中的圖像，然後顯示男性圖片不男性..提前感謝。 –

你可以把你的HTML代碼顯示圖像嗎？ –

我試過但無法將值作爲圖像提取 –

檢索圖像中選定的單選按鈕值

回答

相關問題