将自动完成绑定到动态添加的表单字段

Question

我正在尝试将 jQuery UI 自动完成小部件绑定到动态添加的输入字段。我已经阅读了这里的一些帖子，但似乎没有任何帮助。

我使用的代码来自Dynamically adding a form to a Django formset with Ajax，我稍微修改了它以绑定自动完成功能。

但是，绑定似乎不起作用。每当我输入新添加的字段时，自动完成框都不会显示。我使用的代码如下：

function cloneMore(selector, type,field) {
    var newElement = $(selector).clone(true);
    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;

        if ($(this).attr('type') != 'hidden') {
            $(this).val('');
        }
        $(this).attr({'name': name, 'id': id}).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);

    /* create the selector string and bind autocomplete */
    var select_string = "#id_"+type+"-"+(total-1)+"-"+field;
    $( select_string).autocomplete({
        source: asset_universe_codes,
    });

}

我已经检查过自动完成源可以在函数中访问，所以我很茫然。

谁能帮忙？

谢谢，

杰森

Answer 1

似乎 newElement 尚未附加到 DOM，如果是这种情况，那么附加它（在调用自动​​完成之前）应该可以解决您的问题。