jQuery UI:在多个字段上自动完成,使用不同的源

And*_*rew 5 jquery jquery-ui autocomplete jquery-ui-autocomplete

我有一个页面有多个表单,通过ajax加载.每个表单都包含一个需要自动填充的文本字段.每个文本都有自动完成源的数据属性.例如:

<input type="text" class="district_name" data-autocomplete-source="['foo','bar','baz']" ... />
Run Code Online (Sandbox Code Playgroud)

可能有很多这些,它们将属于不同的形式并修改不同的记录,但自动完成字段将具有相同的类.

如果我这样调用自动完成...

$('input.district_name').autocomplete({
  source: $('input.district_name').data('autocomplete-source')
});
Run Code Online (Sandbox Code Playgroud)

...然后jQuery UI将每个字段的源合并到一个主列表中.我试着打电话给...

$('input.district_name').autocomplete({
  source: $( this ).data('autocomplete-source')
});
Run Code Online (Sandbox Code Playgroud)

...我希望从自己的父母那里获取资源,但这根本不起作用.因为这些字段是通过ajax添加到页面的,所以我事先并不知道他们的个人ID是什么,只有课程.可能有很多或很少,它只取决于用户在做什么.

你怎么解决这个问题?

SLa*_*aks 9

您需要autocomplete为每个元素单独调用:

$('input.district_name').each(function() {
    $(this).autocomplete({
        source: $(this).data('autocomplete-source')
    });
});
Run Code Online (Sandbox Code Playgroud)