jquery克隆html问题,更新DOM?

pan*_*ore 2 html django jquery javascript-events drop-down-menu

我需要javascript/jquery专家帮助解决下一个问题:

---- 1. 此javascript警告select html标记中所选选项的ID:

$(function(){
    $("#id_productos_list").change(
    function(){
        var op = $(this).selectedValues()
        alert(op);
     }
     );
});
Run Code Online (Sandbox Code Playgroud)

---- 2.这个javascript克隆html代码:

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);
}
Run Code Online (Sandbox Code Playgroud)

----这是JS克隆的HTML代码的一部分,它没有任何问题

            <select id="id_productos_list" name="productos_list" >
              <option value="1">One</option>
              <option value="2">Two</option>
            </select>
Run Code Online (Sandbox Code Playgroud)

但只是javascript#1适用于最初的html代码(原始克隆).克隆的其他人不会提醒选定的选项.我已经使用diferents id的attrs测试了每个克隆的选择标签,没有结果.

什么我失踪了?firebug显示克隆的html DOM很好:S我必须在克隆后更新DOM以生成$("#id productos list").change(...)有效吗?

JJ *_*wax 6

您是否尝试过.clone(true)将所有处理程序附加到哪个克隆?它在Clone文档的底部描述.


Dav*_*res 5

jQuery$("#...")语法将通过精确的 id 返回第一个匹配的元素。如果您要克隆元素但不通过它们的 id 区分它们,则此代码将无法按您预期的那样工作。

您可以比较以下两个表达式之间的差异:

alert($("#id_productos_list").size());
Run Code Online (Sandbox Code Playgroud)

...和

alert($("[id='#id_productos_list']").size());
Run Code Online (Sandbox Code Playgroud)

第一个表达式将返回零或一个,具体取决于页面中是否存在 ID 为“id_productos_list”的元素。声明顺序中的第一个元素获胜。

第二个表达式将返回零个或一个或多个,具体取决于页面中具有 id“id_productos_list”的所有元素的集合。

同样重要的是要注意,事件处理程序似乎没有作为clone()操作的一部分被复制。您可能需要将这些处理程序重新分配给新元素。

var newElement = $(selector).clone(true);
Run Code Online (Sandbox Code Playgroud)