обновить атрибуты дочерних элементов после функции jQuery clone - PullRequest
Новая
       4

обновить атрибуты дочерних элементов после функции jQuery clone

3 голосов
/ 25 августа 2011

У меня был какой-то код, который, кажется, работал нормально со старыми версиями jQuery, до 1.4, я думаю.Я заметил, что он перестал работать наверняка с 1.4.4.И до сих пор не работает с 1.6.2.Я провел некоторое исследование, и есть несколько похожих вопросов по этому вопросу, но я не нашел сценария, где после выполнения clone () нужно обновлять нечто большее, чем просто идентификатор.

Кто-нибудь знает, какЯ могу переписать это так, чтобы оно работало с текущей версией 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>

1 Ответ

2 голосов
/ 02 сентября 2011

Хорошо, если кто-то ищет что-то подобное, нашел решение.Я думаю, что это была проблема логики и синтаксиса.Но не уверен, действительно ли мне нужно было изменить синтаксис или нет.Логическая проблема заключалась в том, что 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;     
});
...