的JavaScript自動完成排空之後的輸入選擇

Question

我有這樣的代碼工作正常，但我想清空輸入$項目 用戶選擇後自動完成建議..

$project.autocomplete({ 
     minLength: 1, 
     source: projects, 
     focus: function(event, ui) { 
     $project.val(ui.item.label); 
     return false; 
     }, 
     select: function (e, ui) { 
     createTag(ui.item.label, ui.item.id); 
    } 
    }); 

在何處放置此代碼爲了在自動完成被觸發後執行操作？

//document.getElementById("project").value = ""; 

Answer 1

您需要使用close event：

var projects = [ 
 
    "ActionScript", 
 
    "AppleScript", 
 
    "Asp", 
 
    "BASIC", 
 
    "C", 
 
    "C++", 
 
    "Clojure", 
 
    "COBOL", 
 
    "ColdFusion", 
 
    "Erlang", 
 
    "Fortran", 
 
    "Groovy", 
 
    "Haskell", 
 
    "Java", 
 
    "JavaScript", 
 
    "Lisp", 
 
    "Perl", 
 
    "PHP", 
 
    "Python", 
 
    "Ruby", 
 
    "Scala", 
 
    "Scheme" 
 
]; 
 

 
var $project = $("#tags"); 
 
$project.autocomplete({ 
 
    minLength: 1, 
 
    source: projects, 
 
    focus: function(event, ui) { 
 
    $project.val(ui.item.label); 
 
    return false; 
 
    }, 
 
    close: function (e, ui) { 
 
    e.target.value = ''; 
 
    //createTag(ui.item.label, ui.item.id); 
 
    } 
 
});

<link href="https://code.jquery.com/ui/1.12.0/themes/smoothness/jquery-ui.css" rel="stylesheet"/> 
 
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script> 
 

 
<div class="ui-widget"> 
 
    <label for="tags">Tags: </label> 
 
    <input id="tags"> 
 
</div>

Answer 2

嘗試這種解決方案

select: function (e, ui) { 
    $project.val(""); 
    createTag(ui.item.label, ui.item.id); 
}