如何处理多个div中的多个单选按钮

时间:2013-04-15 00:32:27

标签: javascript jquery

我在容器中输入的字段很少,用户可以将这些字段相乘。我需要根据容器更改输入字段的名称。

<div class="stations">
 <input type="radio" name="pp[prc][0][station][0][id]">
 <input type="radio" name="pp[prc][0][station][1][id]">
</div>

这是我的HTML表单。

$(".stations").each(function(sIndex){
//Loop thru all .station
  $("input:radio", $(this)).each(function(rIndex){
    //Loop thru all radio buttons inside that container and change their names accordingly
   $("input:radio", $(this)).attr('name','pp[prc]['+sIndex+'][stations]['+rIndex+'][id]');
  });
});

当我这样做时,出于某种原因,当用户复制<div class="station">及其内容时,单选按钮的名称不会相应更改。我哪里做错了?

2 个答案:

答案 0 :(得分:1)

您正在使用$(selector, context)并且输入元素不能包含子代,您应该编码:

$(this).attr('name', '...');

答案 1 :(得分:0)

看起来您对选择器存在一些问题。试试这样:

//Loop through each .station
$(".stations").each(function(sIndex){

    //Loop through each radio buttons inside the container
    $(this).find("input:radio").each(function(rIndex){

        // Change the radio name attribute
        $(this).attr('name','pp[prc]['+sIndex+'][stations]['+rIndex+'][id]');
    });
});

Working jsFiddle

Here's a jsFiddle with the names on the screen for quicker viewing.