Javascript，通過多個條件獲取元素（id和值）

我想這個問題很簡單，但我找不到任何解決方案。我想檢查一個單選按鈕是否被選中。從here一個可能的解決方案：Javascript，通過多個條件獲取元素（id和值）

這些輸入

<input type="radio" name="gender" id="gender_Male" value="Male" /> 
<input type="radio" name="gender" id="gender_Female" value="Female" />

你可以簡單地

if(document.getElementById('gender_Male').checked) { 
    //Male radio button is checked 
}else if(document.getElementById('gender_Female').checked) { 
    //Female radio button is checked 
}

然而，我的投入是這樣的：

<label><input id="16" type="radio" value="14" name="Q3"></input>Yes</label> 
<label><input id="16" type="radio" value="15" name="Q3"></input>No</label>

id不是唯一的本身但只能與value結合使用...如何檢查是或否選擇了？

來源

2014-10-27 CptNemo

'id's應該永遠是獨一無二的。如果有重複的元素具有相同的'id'，則它在技術上是無效的HTML。所以，你應該給他們不同的'id's，並且這個問題已經完成 – Markasoftware 2014-10-27 04:03:55

http://jsfiddle.net/m4acu2ce/ – 2014-10-27 04:18:35

根據你的要求，不應該你的單選按鈕具有相同的'name'而不是'id' S' – 2014-10-27 04:18:38

由於@Markasoftware說，id應該始終是唯一的。但瀏覽器仍然用相同的id來解析你的html。

所以關鍵的是你可以選擇一個沒有id的元素。

嘗試document.querySelectorAll或document.querySelector。這裏是代碼：

document.querySelectorAll('input[value="14"]') // you can select all the `value='14'` inputs 
document.querySelectorAll('input[name="Q3"]') // you can select all the `value='Q3'` inputs

你可以撰寫這些css3選擇器，並達到你的目標。

來源

2014-10-27 04:16:26 creeper

你可以嘗試下一個選擇：

$('input#16.14').is(':checked'){ 
    //YES is checked 
} 
$('input#16.15').is(':checked'){ 
    //NO is checked 
}

但ID應該是唯一的。

另一種方法來檢查哪一個選擇它的使用輸入名稱：

$('input[name=Q3]:checked').val()

這樣，如果是檢查或15如果沒有被選中

來源

2014-10-27 04:16:42 rogelio

假設是你會得到14 /否元素是你的性別廣播的下一個元素，你可以嘗試類似：

$('[name="gender"]').change(function(){ 

    if($(this).val() == 'Male'){ 

    $(this).next('input[type="radio"][value="14"]').prop('checked',true); 

    }else{ 
    //Female 

    } 

});

來源

2014-10-27 04:17:46

向你的單選按鈕添加一個類。

$('.radioGroup').change(function(){ 
    if($(this).val() == 'Male'){ 
     /// 
    } else { 
     //female 
    } 
});

來源

2014-10-27 04:21:28 Fergoso

<html> 
     <head> 
      <meta charset="utf-8"> 

      <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css"> 
      <script src="//code.jquery.com/jquery-1.9.1.js"></script> 
      <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script> 

     </head> 

     <body> 
    <label><input id="16" type="radio" value="14" name="Q3"/>Yes</label> 
    <label><input id="16" type="radio" value="15" name="Q3"/>No</label> 

     <script type="text/javascript"> 
      $('input[name=Q3]').change(function() { 
       if ($('input[name=Q3]:checked').length > 0) { 
        var k = $('input[name=Q3]:checked').val(); 
        alert(k); 
       } 
      }); 
     </script> 

     </body> 
    </html>

來源

2014-10-27 06:08:38 renjith

ID應始終是唯一的。 – PeterKA 2014-10-27 12:41:55

$(':radio').on('change',function() { 
 
    if(this.checked && this.value === "14") { 
 
    alert("'Yes' was selected!"); 
 
    } else if(this.checked && this.value === "15") { 
 
    alert("'No' was selected!"); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label><input id="Q3_1" type="radio" value="14" name="Q3">Yes</label> 
 
<label><input id="Q3_2" type="radio" value="15" name="Q3">No</label>

來源

2014-10-27 12:49:12 PeterKA

Javascript，通過多個條件獲取元素（id和值）

回答

相關問題