JQuery клонирование HTML проблема, обновить DOM?

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

---- 1. этот javascript предупреждает идентификатор выбранной опции в HTML-теге select:

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

---- 2. этот HTML-код клона JavaScript:

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-кодом (оригинал для клона). клонированные другие не предупреждают выбранные параметры. Я проверил с помощью attr-идентификаторов attr для каждого клонированного тега select, но безрезультатно.

Что мне не хватает? Firebug отображает клонированный HTML DOM приятно:S Нужно ли обновлять DOM после клонирования, чтобы $("#id productos list").change(...) работал?

Источник

2 ответа

Решение

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

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

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

...а также

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

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

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

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

var newElement = $(selector).clone(true);
Источник

Ты пытался .clone(true) какие клоны все прикрепленные обработчики? Это описано внизу документации клона.

Источник
Другие вопросы по тегам