jquery自动完成从下拉菜单中删除选定的li项目

Question

我正在使用jquery自动完成(1.8)来填充标签，就像http://net.tutsplus.com/tutorials/javascript-ajax/how-to-use-the-jquery-ui-autocomplete-widget/中解释的那样.

我需要的是从下拉菜单中选择 LI 项目后，该项目应该从列表中删除。

在自动完成的选择部分中，我尝试使用 diff 方法获取当前 LI，例如

$(this).get(0).tagname //which return undefined 
e.target.id //which return id of textfield to which autocomplete is bound

Answer 1

假设您完全按照链接到的教程进行操作:

1. 在附加自动完成功能之前，创建一个空数组来保存应忽略的项目 (varignore=[];)。您可以将其放在全局范围内，以确保可以在任何地方访问它(放在 $(function() { ... 之前)。

2. 在 source 回调(用于格式化结果)的定义中，替换此

   //process response
   $.each(data, function(i, val){
       suggestions.push(val.name);
   });
   

   这样:

   //process response
   $.each(data, function(i, val){
       if(ignored.indexOf(val.name) == -1) {
           suggestions.push(val.name);
       }
   });
   

3. 然后，在 select 回调中，将所选项目的值添加到 ignored 数组中:

   ignored.push(ui.item.value)
   

4. 如果用户单击删除链接，您可能希望“取消忽略”该项目。在删除处理程序定义内的第一行添加以下内容:

   var text = $(this).parent().find('a').remove().end().text();
   var position = ignored.indexOf(text);
   if(position != -1) {
       ignored.splice(position, 1);
   }
   // rest of the original code below...