jquery-ui 自动补全多个实例

Question

您好，我在一个页面上运行了多个 jQuery-UI 自动完成实例。

<div id="div1">
<input name= "city[1]" class= "city" id="city1" />
<select name = "select1" class = "zipcodes" id = "zipcodes1"></select>
</div>

<div id="div2">
<input name= "city[2]" class= "city" id="city2" />
<select name = "select2" class = "zipcodes" id = "zipcodes2"></select>
</div>

这些字段由 javascript 添加。自动完成功能适用于输入。回调填充邮政编码字段选项。

 select: function( event, ui ) {
    $($(".city").sibling("zipcodes")).empty();
    $.each(ui.item.zip, function(Index, Value){
         // Populate the zipcodes fields
        });
        }

问题在于它填充了页面上的所有邮政编码字段

我尝试过使用

(".city").autocomplete( "widget" )

选择正在查询的特定自动完成，但它仍会填充所有字段。

如何识别正在查询的特定字段？

Answer 1

试试：

select: function( event, ui ) {
    $(this).sibling(".zipcodes").empty();

       $.each(ui.item.zip, function(Index, Value){
         // Populate the zipcodes fields
           $(this).sibling(".zipcodes") .......
        });
        }