Тестирование существующего элемента с помощью jQuery. length не позволяет увидеть вновь созданные элементы


Я пытаюсь создать систему копирования / вставки для таблицы HTML с помощью jQuery и плагина контекстного меню, и я пытаюсь однозначно назвать все вновь созданные строки. Поэтому у меня есть функция, которая клонирует выбранную строку и вставляет новую строку выше:

function cloneAbove(TR) {
    var newRow = $(TR).clone();
    var lastID = $(TR).attr('id');
    var newID = Number(lastID.substring(3))-0.1;

    //See if that row already exists:
    if($('#tr_'+newID).length){
    alert('#tr_'+newID+' Exists');
    //If it does exist, we divide the newID by 10 until we find one that doesn't:
    var i = 0;
    while(i < 1){
        newID = newID/10;
        if($('#tr_'+newID).length > 0){
        i = 1;
        }
    }
    }
    $(newRow).attr('id','tr_'+newID);
    $(TR).before(newRow);
    $(".target").contextmenu(option);
}

Сначала он клонирует выбранную строку (т. е.: '#tr_1'), вычитает 0.1 для идентификатора новой строки (т. е.: '#tr_0. 9'), затем он должен проверить, существует ли этот идентификатор уже - вот где моя проблема - если он существует, он входит в цикл делить на 10 до тех пор, пока он не найдет идентификатор, который этого не делает.

Вот пример таблицы:

<table id="table" border=1>
       <tr class="target" id="tr_1" oncontextmenu="context('tr1')">
           <td id="tr_1_1">Row1</td>
           <td id="tr_1_2">Row1</td>
       </tr>
       <tr class="target" id="tr_2" oncontextmenu="context('tr2')">
           <td id="tr_2_1">Row2</td>
           <td id="tr_2_2">Row2</td>
       </tr>
</table>

The .длина работает для "жестко закодированных" элементов, как они существуют, когда страница загружается, но он не будет обнаруживать ни один из вновь созданных элементов. Есть предложения?

2 2

2 ответа:

Вы создаете значения "id", которые сбивают с толку jQuery. Селектор "#tr_0. 9 "означает" найти элемент с идентификатором 'tr_0' и классом '9'", а не"найти элемент с идентификатором'tr_0.9'".

Оставляя в стороне тот факт, что это кажется мне довольно странным способом построения значений "id", вы можете заставить его работать, "цитируя"."символы:

if ($(('#tr_' + newId).replace(/\./g, "\\.")).length) {
  // ... found a duplicate ...

То, что это делает, является заменой "." для "."в построенном пробном значении" id". Вы только хотите сделать это, конечно, когда поиск элементов через селектор jQuery; вы не хотите, чтобы фактическое значение " id " имело обратные косые черты.

В качестве альтернативы вы можете заменить ".- символы с буквой " _ " или что-то в этом роде.

Вам нужно подумать о том, как ваш селектор jQuery анализируется. Когда вы добавляете новую строку, Ваш идентификатор новой строки устанавливается в десятичную цифру (т. е. '0.9'). Но при использовании селектора jQuery $('#tr_0.9') вы говорите:

Получаем элемент A с идентификатором 'tr_0' и класс "9".

Оператор точки является обозначением для селектора класса. Попробуйте использовать целые числовые значения вместо десятичных.

Edit: я был слишком медленным!