Php 为什么jQuery自动完成更新我克隆表单上的所有元素？

我有一个表单，它在两个元素上使用jQueryUIAutoComplete函数，并且能够使用插件克隆自身

这两个元素都是文本输入。一旦从第一个自动完成选项（大陆）中选择了一个值，第二个自动完成选项（国家）的值将根据第一个选择填充选项

我的问题是，当进行克隆时，如果用户从第一个自动完成（大陆）选项中选择一个选项，它会更改所有克隆上的第一个输入值。第二个输入（国家/地区）不会发生这种情况

我错过了什么

注意：表单id和name中的#index#不是CFML。我使用的是PHP，散列标签是SheepIt的一部分！克隆插件

Javascript:

<script src="../../scripts/jquery-1.6.4.js"></script>
<script src="../../scripts/jqueryui/ui/jquery.ui.core.js"></script>
<script src="../../scripts/jquery.ui.widget.js"></script>
<script src="../../scripts/jquery.ui.position.js"></script>
<script src="../../scripts/jquery.ui.autocomplete.js"></script>
<script src="../../scripts/jquery.sheepIt.min.js"></script>
<script type="text/javascript">

$(document).ready(function() {

    function ord(chr) {

        return chr.charCodeAt(0);

    }

    function chr(num) {

        return String.fromCharCode(num);

    }

    function quote(str) {

        return '"' + escape(str.replace('"', "'")) + '"';

    }

    String.prototype.titleCase = function () {

        var chars = [" ", "-"];
        var ths = String(this).toLowerCase();

        for (j in chars){

            var car = chars[j];
            var str = "";
            var words = ths.split(car);
            for(i in words){

                str += car + words[i].substr(0,1).toUpperCase() + words[i].substr(1);

            }

            ths = str.substr(1);

        }

        return ths;

    }

    function incrementTerm(term) {

        for (var i = term.length - 1; i >= 0; i--){

            var code = term.charCodeAt(i);

            if (code < ord('Z'))

                return term.substring(0, i) + chr(code + 1);

        }

        return '{}'

    }

    function parseLineSeperated(data){

        data = data.split("\n");

        data.pop(); // Trim blank element after ending newline

        var out = []

        for (i in data){

            out.push(data[i].titleCase());

        }

        return out;

    }

    function loadcontinent(request, response) {

        var startTerm = request.term.toUpperCase();

        var endTerm = incrementTerm(startTerm);

        $.ajax({

            url: '/db/continent.php?startkey='+startTerm+'&endkey='+endTerm,

            success: function(data) {

                var items = parseLineSeperated(data);

                response(items);

            },

            error: function(req, str, exc) {

                alert(str);

            }

            });

    }

    function loadcountry(request, response) {

        var startTerm = request.term.toUpperCase();

        var endTerm = incrementTerm(startTerm);

        var continent = $('.continent_autocomplete').val().toUpperCase();

        $.ajax({

            url: '/db/country.php?key=' + continent,

            success: function(data) {

                var items = parseLineSeperated(data);

                response(items);


            },

            error: function(req, str, exc) {

                alert(str);

            }

            });

    }

    $('#location_container_add').live('click', function() { 
        $("input.continent_autocomplete").autocomplete(continent_autocomplete);
        $("input.continent_autocomplete").keyup(continent_autocomplete_keyup);  
        $("input.country_autocomplete").autocomplete(country_autocomplete);     
        $("input.country_autocomplete").keyup(country_autocomplete_keyup);      
        $('input.country_autocomplete').focus(country_autocomplete_focus);
    });


    var location_container = $('#location_container').sheepIt({
            separator: '',
            allowRemoveLast: true,
            allowRemoveCurrent: false,
            allowRemoveAll: false,
            allowAdd: true,
            allowAddN: false,
            maxFormsCount: 10,
            minFormsCount: 1,
            iniFormsCount: 1
    });

    var continent_autocomplete = {

        source: loadcontinent,

        select: function(event, ui){

            $("input.continent_autocomplete").val(ui.item.value);

        }

    }

    var continent_autocomplete_keyup = function (event){

        var code = (event.keyCode ? event.keyCode : event.which);

        event.target.value = event.target.value.titleCase();

    }

    var country_autocomplete = {

        source: loadcountry,

    }

    var country_autocomplete_keyup = function (event){

        event.target.value = event.target.value.titleCase();

    }

    var country_autocomplete_focus = function(){           
        if ($(this).val().length == 0) {
            $(this).autocomplete("search", " ");
        }
    }   

    $("input.continent_autocomplete").autocomplete(continent_autocomplete);
    $("input.continent_autocomplete").keyup(continent_autocomplete_keyup);
    $("input.country_autocomplete").autocomplete(country_autocomplete);
    $("input.country_autocomplete").keyup(country_autocomplete_keyup);
    $('input.country_autocomplete').focus(country_autocomplete_focus);

});

</script>

$（文档）.ready（函数（）{
功能ord（chr）{
返回chr.charCodeAt（0）；
}
函数chr（num）{
返回字符串.fromCharCode（num）；
}
函数引用（str）{
返回'''+escape（str.replace（''''，'''））+'''；
}
String.prototype.titleCase=函数（）{
var chars=[“”，“-”]；
var ths=String（this.toLowerCase（）；
用于（单位：焦耳）{
var car=chars[j]；
var str=“”；
var words=ths.分割（car）；
for（我用大写）{
str+=car+words[i].substr（0,1）.toUpperCase（）+words[i].substr（1）；
}
ths=str.substr（1）；
}
返回ths；
}
函数递增项（项）{
对于（var i=term.length-1；i>=0；i--）{
var代码=术语charCodeAt（i）；
if（代码

HTML:

大陆名称：
国家：

该代码明确表示要将类“Continental\u autocomplete”的每个

的值设置为所选值

你可能想要像这样的东西

        $(this).val(ui.item.value);

但这取决于自动完成代码的工作方式

该代码明确表示要将类“Continental\u autocomplete”的每个

的值设置为所选值

你可能想要像这样的东西

        $(this).val(ui.item.value);

但这取决于自动完成代码的工作方式。

这一行：

$（“input.constratine\u autocomplete”）.val（ui.item.value）；

正在使用类

constratine\u autocomplete

更新所有输入

更新： 发件人：

从菜单中选择项目时触发；ui.item指 所选项目。select的默认操作是替换文本 带t的字段值

        $(this).val(ui.item.value);