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和值）

回答

相关问题