Проблема с jQuery cloning html, обновление DOM?

Мне нужна помощь экспертов javascript/jquery для решения следующей проблемы:

---- 1. этот javascript предупреждает об идентификаторе выбранного параметра в выбранном теге html:

$(function(){
    $("#id_productos_list").change(
    function(){
        var op = $(this).selectedValues()
        alert(op);
     }
     );
});

2 ----. этот javascript clone html code:

function cloneMore(selector, type) {
    var newElement = $(selector).clone();
    var total = $('#id_' + type + '-TOTAL_FORMS').val();

    newElement.find(':input').each(function() {
        var name = $(this).attr('name').replace('-' + (total-1) + '-','-' + total + '-');
        var id = 'id_' + name;
        $(this).attr({'name': name, 'id': id}).val('').removeAttr('checked');
    });
    newElement.find('label').each(function() {
        var newFor = $(this).attr('for').replace('-' + (total-1) + '-','-' + total + '-');
        $(this).attr('for', newFor);
    });

    total++;
    $('#id_' + type + '-TOTAL_FORMS').val(total);
    $(selector).after(newElement);
}

---- это часть HTML-кода, который JS клонирует, и он работает без проблем

            <select id="id_productos_list" name="productos_list" >
              <option value="1">One</option>
              <option value="2">Two</option>
            </select>

НО только javascript # 1 работает с исходным кодом html (оригинал для клона). клонированные другие не предупреждают о выбранных параметрах. Я тестировал с разными значениями id attrs для каждого клонированного тега select без результатов.

Что не хватает? firebug отображает клонированный html DOM: S Я должен обновить DOM после клонирования, чтобы сделать $( "# product productos" ). change (...) работает?

Ответ 1

Синтаксис jQuery $("#...") вернет первый согласованный элемент точным идентификатором. Если вы клонируете элементы, но не различаете их по их идентификатору, этот код не будет работать так, как вы ожидаете.

Вы можете сравнить различия между двумя следующими выражениями:

alert($("#id_productos_list").size());

... и

alert($("[id='#id_productos_list']").size());

Первое выражение вернет либо ноль, либо один, в зависимости от наличия элемента с идентификатором id_productos_list на вашей странице. Побеждает первый элемент в объявленном порядке.

Второе выражение будет возвращать ноль или один или несколько в зависимости от набора всех элементов с id "id_productos_list" на вашей странице.

Также важно отметить, что не отображается, что обработчики событий копируются как часть операции clone(). Возможно, вам придется переназначить эти обработчики новым элементам.

var newElement = $(selector).clone(true);

Ответ 1

Ответ 2