Question

我想从item呈现列表中删除jquery-ui autocomplete

让我们说这个项目是康普顿

问题：我想从外部{strong>不从辅助功能（例如item等）中移除select,create,open“康普顿” >

下面是我的代码：

 $(function() {
    var availableTags = [
        "john",
        "khair",
        "compton",
        "Jordan",
        "Micheal",
        "Peter"
    ];
    
   $( "#tags" ).autocomplete({
        source: availableTags
   }).focus(function () {
         $("#tags").autocomplete("search");
    });
   
   // logic to remove item "compton" must reflect in rendered ui
});

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>


<div class="ui-widget">
<label for="tags">Search: </label>
<input id="tags">
</div>

Answer 1

尝试使用option method来设置一个或多个自动完成选项。

$(function() {
  var availableTags = [
    "john",
    "khair",
    "compton",
    "Jordan",
    "Micheal",
    "Peter"
  ];

  $("#tags").autocomplete({
    source: availableTags
  }).focus(function() {
    $("#tags").autocomplete("search");
  });

  $("#tags").autocomplete("option", "source", availableTags.filter(i => i !== "compton"));
});

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>


<div class="ui-widget">
  <label for="tags">Search: </label>
  <input id="tags">
</div>

我如何从jQuery UI自动完成呈现列表中删除项目

1 个答案: