jQuery的发现动态输入名称

我有一个简单的形式与单选按钮jQuery的发现动态输入名称

<form> 
<input type="radio" name="radio_1" value="1" />Radio 1 
<input type="radio" name="radio_1" value="2" />Radio 2 
<input type="radio" name="radio_1" value="3" />Radio 3 
</form>

和我有相同的无线电额外的div（无形体）

<div class="attributes"> 
<input type="radio" name="radio_1" value="1" />Radio 1 
<input type="radio" name="radio_1" value="2" />Radio 2 
<input type="radio" name="radio_1" value="3" />Radio 3 
</div>

我想和同名电台当我检查DIV中的收音机时要检查FORM中的值。

我该怎么做？

来源

2016-08-22 Albus One

使用jQuery，选择div输入：'$（ “DIV输入[类型= '无线电']”）'然后添加一个点击方法把它们，当你点击的那些无线电按钮，它会检查所有其他人，将名称和值与其他无线电进行比较，并检查它们是否匹配。 –

使用此代码：

$(".attributes :radio").on("change",function(){ 

$("form input[value = " + $(this).val() + "]").prop("checked",$(this).prop("checked")); 

})

最终代码：

<html> 
 
    <head> 
 
     <meta charset="utf-8"> 
 
    </head> 
 
    <body> 
 
     <form> 
 
      <input type="radio" name="radio_1" value="1" />Radio 1 
 
      <input type="radio" name="radio_1" value="2" />Radio 2 
 
      <input type="radio" name="radio_1" value="3" />Radio 3 
 
     </form> 
 
     <div class="attributes"> 
 
      <input type="radio" name="radio_1" value="1" />Radio 1 
 
      <input type="radio" name="radio_1" value="2" />Radio 2 
 
      <input type="radio" name="radio_1" value="3" />Radio 3 
 
     </div> 
 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
     <script> 
 
      $(document).ready(function(){ 
 
       $(".attributes :radio").on("change",function(){ 
 
        $("form input[value = " + $(this).val() + "]").prop("checked",$(this).prop("checked")); 
 
       }) 
 
      }) 
 
     </script> 
 
    </body> 
 
</html>

来源

2016-08-22 13:29:13 Ehsan

这对我有用。谢谢 –

连接然后change()事件处理程序使用attribute equals selector得到形成相应的元素，并将它的使用prop()方法检查属性。

$('.attributes :radio').change(function() { 
 
    $('form [name="radio_1"][value="' + this.value + '"]').prop('checked', this.checked); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form> 
 
    <input type="radio" name="radio_1" value="1" />Radio 1 
 
    <input type="radio" name="radio_1" value="2" />Radio 2 
 
    <input type="radio" name="radio_1" value="3" />Radio 3 
 
</form> 
 

 
<div class="attributes"> 
 
    <input type="radio" name="radio_1" value="1" />Radio 1 
 
    <input type="radio" name="radio_1" value="2" />Radio 2 
 
    <input type="radio" name="radio_1" value="3" />Radio 3 
 
</div>

来源

2016-08-22 13:18:34

可以使用<lable>标签和添加for属性是指单选按钮的标识符。如下所述

此外，我已经添加JavaScript选择相同的辐射按钮虎钳，反之亦然。

$('form input[type="radio"], attribute input[type="radio"]').click(function(){ 
 
    //alert($(this).attr('name')+"::"+$(this).attr('value')); 
 
$('input[name="'+$(this).attr('name')+'"][value="'+$(this).attr('value')+'"]').not(this).trigger('click'); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
 
<form> 
 
<input type="radio" name="radio_1" id="radio_11" value="1" /><label for="radio_11" >Radio 1</label> 
 
<input type="radio" name="radio_1" id="radio_12" value="2" /><label for="radio_12" >Radio 1</label> 
 
<input type="radio" name="radio_1" id="radio_13" value="3" /><label for="radio_13" >Radio 1</label> 
 
</form> 
 

 
<div class="attributes"> 
 
<input type="radio" name="radio_1" id="radio_21" value="1" /><label for="radio_21" >Radio 1</label> 
 
<input type="radio" name="radio_1" id="radio_22" value="2" /><label for="radio_22" >Radio 1</label> 
 
<input type="radio" name="radio_1" id="radio_23" value="3" /><label for="radio_23" >Radio 1</label> 
 
</div>

来源

2016-08-22 13:18:39

此解决方案适用于标签点击... !!! –

有几个方法可以做到这一点，但简单的方法是使基于名称和值的选择。

$('input[type="radio"]').on("change", function() { 
 
    $('input[type="radio"][name="'+this.name+'"][value="'+this.value+'"]').prop("checked", true); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<form> 
 
<input type="radio" name="radio_1" value="1" />Radio 1 
 
<input type="radio" name="radio_1" value="2" />Radio 2 
 
<input type="radio" name="radio_1" value="3" />Radio 3 
 
</form> 
 

 

 
<div class="attributes"> 
 
<input type="radio" name="radio_1" value="1" />Radio 1 
 
<input type="radio" name="radio_1" value="2" />Radio 2 
 
<input type="radio" name="radio_1" value="3" />Radio 3 
 
</div>

来源

2016-08-22 13:20:53 epascarello

这应该做到！ 它将与演示中演示的多组复选框一起使用。

$('div :radio').change(function() { 
 
     $('form :radio[name="' + this.name + '"][value="' + this.value + '"]').prop('checked', true); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form> 
 
A: <input type="radio" name="radio_1" value="1" />Radio 1 
 
<input type="radio" name="radio_1" value="2" />Radio 2 
 
<input type="radio" name="radio_1" value="3" />Radio 3 
 
    
 
    <br> 
 
B: <input type="radio" name="radio_2" value="1" />Radio 1 
 
<input type="radio" name="radio_2" value="2" />Radio 2 
 
<input type="radio" name="radio_2" value="3" />Radio 3 
 
</form> 
 

 
<div class="attributes"> 
 
A: <input type="radio" name="radio_1" value="1" />Radio 1 
 
<input type="radio" name="radio_1" value="2" />Radio 2 
 
<input type="radio" name="radio_1" value="3" />Radio 3 
 
    <br> 
 
B: <input type="radio" name="radio_2" value="1" />Radio 1 
 
<input type="radio" name="radio_2" value="2" />Radio 2 
 
<input type="radio" name="radio_2" value="3" />Radio 3 
 
</div>

来源

2016-08-22 13:34:00 PeterKA

jQuery的发现动态输入名称

回答

相关问题