jquery自动完成:我的克隆的自动完成字段不工作

Question

我对jquery非常陌生，特别是对于jqueryUI，我多次尝试克隆一个工作的自动完成字段，但是克隆()ed元素不再是自动完成的了.(该自动完成声明适用于同一类的许多字段，它在克隆之后停止工作)下面是我的jquery代码：

$(function(){
        var patologie;
        $.get("ajax/lista_patologie.php",function(data){patologie = data;           
        $('.patologia').each(function(i, el) {
        el = $(el);
        el.autocomplete({
        minLength: 0,
        source: patologie,
        focus: function( event, ui ) {
            $(this).val( ui.item.Topography );
            return false;
        },
        select: function( event, ui ) {
            $(this).val(ui.item.Topography);
            return false;
        }
        })
        .data("autocomplete")._renderItem = function( ul, item ) {
            return $( "<li></li>" )
            .data("item.autocomplete", item )
            .append("<a>" + item.Topography + "<br/>" + item.Description + "</a>" )
            .appendTo(ul);
        };
        });
        },'json');
});

这里是我拥有和克隆字段的页面：

<script type="text/javascript"> 
    function adddiv(classe){
    var clonedEl = $('.'+classe+':last').clone(true);
    $(clonedEl).find('input:text').val('');
    clonedEl.insertAfter('.'+classe+':last');
    $('.'+classe).children('img[src*="delete"]').show();
    }
    function remdiv(el){
    var parents = $('.'+el.parent().attr('class').toString());
    if (parents.size()> 1) {
        el.parent().remove();
    }
    if (parents.size()== 2){
        parents.children('img[src*="delete"]').hide();
        }
    }
    </script>

<div class="divpatologia">
<input class="codpatologia"></input>
<img src="css-images/delete_icon.png" align="absmiddle" onClick="remdiv($(this));" style="display: none;"/>
</div>
<input type="button" onClick="adddiv('divpatologia');" value = "+"/>

我应该在某种程度上重新开始自动完成吗？？怎么做？？提前谢谢大家！

Answer 1

我自己解决的！首先，我创建了一个外部函数来初始化自动完成，并将数据源作为参数，如下所示：

function initAutocompletePat(patologie){
$('.codpatologia').each(function(i, el) {
    el = $(el);
    el.autocomplete({
        minLength: 0,
        source: patologie,
        focus: function( event, ui ) {
            $(this).val( ui.item.Topography );
            return false;
        },
        select: function( event, ui ) {
            $(this).val(ui.item.Topography);
            return false;
        }
    })
    .data("autocomplete")._renderItem = function( ul, item ) {
        return $( "<li></li>" )
            .data("item.autocomplete", item )
            .append("<a>" + item.Topography + "<br/>" + item.Description + "</a>" )
            .appendTo(ul);
    };
});
}

然后，我在.get回调中调用init函数来初始化第一个原始元素(而不是克隆元素)，如下所示：

$(function(){
$.get("ajax/lista_patologie.php",function(data){initAutocompletePat(data);},'json');    
}); 

以后每次我克隆一个元素时，我都会调用

initAutocompletePat(源)

函数将类型中第一个元素的源传递给它，如下所示：

function aggiungiPat(classe){
var clonedEl = $('.'+classe+':last').clone();
$(clonedEl).find('input:text').val('');
clonedEl.insertAfter('.'+classe+':last');
$('.'+classe).children('img[src*="delete"]').show();

var source = $('.'+classe+':first' ).find('input:text').autocomplete( "option", "source" );
initAutocompletePat(source);
}

这个.autocomplete(“选项”、“源”)；是从已经初始化的自动完成控件中获取源。

希望它对某人有用！不管怎样，谢谢大家。