Question

我有一些代码似乎可以使用旧版本的jQuery，直到1.4我认为。我注意到1.4.4它确实停止了工作。并且仍然不适用于1.6.2。我做了一些研究，在这个问题上有一些类似的问题，但是我没有找到一个场景，在做一个clone（）之后不仅需要更新id。

有谁知道如何重新编写这个，以便它可以使用当前版本的jQuery？

 //Add dynamic Shot handling
$('#link_addShot').click(function() {
  var cloned = $('#tbl_shots tbody tr:last').clone(true);
  prevNum = numOfShots;
        numOfShots = numOfShots + 1;
  $('#shot_number_' + prevNum, cloned).attr('name', 'shot_number_' +  numOfShots);
        $('#shot_type_id_' + prevNum, cloned).attr('name', 'shot_type_id_' +  numOfShots);
        $('#player_id_' + prevNum, cloned).attr('name', 'player_id_' +  numOfShots);

        $('#shot_number_' + prevNum, cloned).attr('id', 'shot_number_' +  numOfShots);
        $('#shot_type_id_' + prevNum, cloned).attr('id', 'shot_type_id_' +  numOfShots);
        $('#player_id_' + prevNum, cloned).attr('id', 'player_id_' +  numOfShots);
  $('#removeLink', cloned).html('<a href="#">Remove</a>');
  $('#removeLink a', cloned).click(function() {
    $(this).parent().parent().parent().remove();
    return false;
  })

  $('#shot_type_id_' + numOfShots, cloned).val(0);
        $('#player_id_' + numOfShots, cloned).val(0);

  $('#tbl_shots').append(cloned);
  $(this).removeClass('form_button_hover');
  return false;     
});

    //remove link handling
    $(".link_remove").click(function() {
        $(this).parent().parent().parent().remove();
        return false;
    });

哦，如果我包含我试图克隆的tr标记，它可能会有所帮助：

<tr>
<td><input id="shot_number_5" type="hidden" value="" name="shot_number_5">
<select id="shot_type_id_5" class="shot_type_id" name="shot_type_id_5">
  <option value="0">Unknown</option>
  <option value="1">Tee</option>
  <option value="2">Fairway</option>
  <option value="3">Rough</option>
  <option value="4">Bunker (fairway)</option>
  <option value="8">Bunker (greenside)</option>
  <option value="5">Fringe</option>
  <option selected="selected" value="6">Green</option>
  <option value="7">Penalty</option>
  <option value="9">Concede</option>
  <option value="10">Pick Up</option>
</select></td>
<td class="td_last" align="center"><div id="removeLink"> <a class="link_remove" href="">Remove</a> </div></td>
</tr>

Answer 1

好的，如果其他人正在寻找类似的东西，找到一个解决方案。我认为这既是一个逻辑问题，也是一个语法问题。但不确定我是否真的需要改变语法。逻辑问题是prevNum实际上是不正确的，所以我改为使用带有通配符的find（）函数，因为我知道克隆元素中只有一个。

//Add dynamic Shot handling
$('#link_addShot').click(function() {
numOfShots = numOfShots + 1;
var cloned = $('#tbl_shots tbody tr:last').clone(true);
cloned.find('#[id*=shot_number_]').attr('id', 'shot_number_' +  numOfShots).attr('name','shot_number_' +  numOfShots);
cloned.find('#[id*=shot_type_id_]').attr('id', 'shot_type_id_' +  numOfShots).attr('name','shot_type_id_' +  numOfShots).val(0);            
cloned.find('#[id*=player_id_]').attr('id', 'player_id_' +  numOfShots).attr('name','player_id_' +  numOfShots).val(0);
cloned.find('.removeLink').html('<a href="#">Remove</a>');
cloned.find('.removeLink a').click(function() {
$(this).parent().parent().parent().remove();
return false;
});

$('#tbl_shots').append(cloned);

$(this).removeClass('form_button_hover');
return false;     
});

在jQuery克隆函数之后更新子元素的属性

1 个答案: