jquery函数：是一个无线电检查/相同的ID

Question

我有一台收音机。

 <label class="radio inline" for="radios-BRE2b1">
    <input type="radio" name="radios-BRE2b1" id="BRE2b1" value="oui" required="" class="requiredvqradio">Oui</label>
<label class="radio inline" for="radios-BRE2b1">
    <input type="radio" name="radios-BRE2b1" id="BRE2b1" value="non" required="" class="requiredvqradio">Non</label>
<label class="radio inline" for="radios-BRE2b1">
    <input type="radio" name="radios-BRE2b1" id="BRE2b1" value="nsp" required="" class="requiredvqradio">Je ne sais pas</label>

好的，它无效...不是唯一 ID。

我想创建一个函数来知道是否选择了其中一项。

    function testemoi(name) {
    alert(name);
    $(this).find("#" + name).each(function (i, obj) {

        alert(obj.attr('name'));

        if (obj.is(":checked"))

        alert("ok");

    });


}
testemoi("radios-BRE2b1");

我认为我的函数有语法问题，但我看不出有什么问题。

jsfiddle here

感谢您的帮助。

Answer 1

由于标识的使用无效，您不能使用# 选择器来查找元素。那只会找到其中一个元素，因此您需要改用属性选择器。

在each 循环中，作为参数获得的对象是一个元素，而不是包含该元素的 jQuery 对象。

你用字符串"radios-BRE2b1"调用函数，但是元素的id是BRE2b1。

我通过单击链接运行该功能，以便您可以在测试前选择单选按钮：

function testemoi(name) {
  log(name);
  $("[id=" + name + "]").each(function (i, obj) {
    log($(obj).attr('name') + ': ' + $(obj).is(":checked"))
  });
}

$(document).ready(function(){
  $('.test').click(function(){
    testemoi("BRE2b1");
  });
});

function log(text){
  $('.log').append($('<div>').text(text));
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<label class="radio inline" for="radios-BRE2b1">
    <input type="radio" name="radios-BRE2b1" id="BRE2b1" value="oui" required="" class="requiredvqradio">Oui</label>
<label class="radio inline" for="radios-BRE2b1">
    <input type="radio" name="radios-BRE2b1" id="BRE2b1" value="non" required="" class="requiredvqradio">Non</label>
<label class="radio inline" for="radios-BRE2b1">
    <input type="radio" name="radios-BRE2b1" id="BRE2b1" value="nsp" required="" class="requiredvqradio">Je ne sais pas</label>
<br>
<a href="#" class="test">Click me to test</a>

<div class="log"></div>

Answer 2

当我们使用#选择器时，我们总是得到第一个元素，我们必须选择所有元素，通过使用名称语法

添加了示例按钮，单击该按钮可以找到选择了哪个单选按钮。

function testemoi(name) {
    
    $("input[name='"+name+"']").each(function (e) {
        var obj = $(this);
        alert(obj.attr('name'));

        if (obj.is(":checked"))
	       alert("ok");

    });

}
testemoi("radios-BRE2b1");
//for demo click on demo button
$("#test").on("click",function(){testemoi("radios-BRE2b1");});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<label class="radio inline" for="radios-BRE2b1">
    <input type="radio" name="radios-BRE2b1" id="BRE2b1" value="oui" required="" class="requiredvqradio">Oui</label>
<label class="radio inline" for="radios-BRE2b1">
    <input type="radio" name="radios-BRE2b1" id="BRE2b1" value="non" required="" class="requiredvqradio">Non</label>
<label class="radio inline" for="radios-BRE2b1">
    <input type="radio" name="radios-BRE2b1" id="BRE2b1" value="nsp" required="" class="requiredvqradio">Je ne sais pas</label>
    <button id="test">Test</button>

希望对你有帮助

Answer 3

您在代码中犯了两个错误

• 选择器应该是这样的

  $("input[name='" + name+"']:checked").each(function (i, obj) { // correct
  
  $(this).find("#" + name)// incorrect your code 
  

• 获取对象值应该在$内

  $(obj).attr('name'),$(obj).is(":checked") // correct
  
  obj.is(":checked") ,obj.attr('name') // incorrect your code 
  

最后你更正的小提琴代码应该如下所示：

http://jsfiddle.net/yn1h47nt/5/

function testemoi(name) {debugger;
    alert(name);
    $("input[name='" + name+"']:checked").each(function (i, obj) {

        alert($(obj).attr('name'));

        if ($(obj).is(":checked"))

        alert("ok");

    });

}
testemoi("radios-BRE2b1");

您可以像以下条件一样轻松检查选择的收音机之一：

http://jsfiddle.net/yn1h47nt/4/

  if (!$(".requiredvqradio:checked").val()) {
   alert('Nothing is checked!');
}
else {
  alert('one of radio button is checked!');
}