JQuery的自動完成，如果沒有找到數據，然後顯示通知

我已經添加搜索下拉與jQuery。它的搜索很好。現在，如果輸入數據與我的數組數據不匹配，然後在輸入字段的下方顯示文本消息通知，並且文本與數組匹配，然後自動隱藏消息通知，我想添加它。我怎樣才能做到這一點？JQuery的自動完成，如果沒有找到數據，然後顯示通知

<input type='text' title='Tags' id='tags' />

$(document).ready(function() { 

    var aTags = ["ask","always", "all", "alright", "one", "foo", "blackberry", "tweet","force9", "westerners", "sport"]; 

    $("#tags").autocomplete({ 
     source: aTags 
    }); 

});

來源

2017-10-06 rayan005

要做到這一點，你可以使用response事件自動完成的。它接收一個包含匹配數組的對象。如果這個數組是空的，你知道有沒有比賽，你能證明你的留言：

var aTags = ["ask", "always", "all", "alright", "one", "foo", "blackberry", "tweet", "force9", "westerners", "sport"]; 
 
var $noMatches = $('.no-matches'); 
 

 
$("#tags").autocomplete({ 
 
    source: aTags, 
 
    response: function(e, result) { 
 
    $noMatches.hide(); 
 
    if (!result.content.length) 
 
     $noMatches.show(); 
 
    } 
 
});

span { 
 
    display: none; 
 
    color: #C00; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script> 
 
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.0/themes/smoothness/jquery-ui.css" /> 
 
<input type='text' title='Tags' id='tags' /> 
 
<span class="no-matches">No matches!</span>

注意，SO片段編輯器當前打破，所以這裏是一個小提琴工作示例： https://jsfiddle.net/vfzrgnon/

來源

2017-10-06 09:20:49

請檢查此鏈接https://jsfiddle.net/Sakib001 23/jjc05c4h/1 /。第一次的數據不符合爲什麼它顯示「不匹配」的信息。它的好處是，如果數據與數組相匹配，則隱藏該消息。我怎樣才能做到這一點？ – rayan005

你需要調用'hide（）'，而不是'hide'。然後你需要在另一種情況下添加'show（）'：https：//jsfiddle.net/jjc05c4h/2/。另外請注意，它是'message'，而不是'messag'。儘管如此，我會按照我在示例中所做的方式進行操作。你的邏輯只是增加了不必要的複雜化 –

在你的HTML添加這個它的工作原理

<div class="ui-widget"><input type='text' title='Tags' id='tags' /></div>

來源

2017-10-06 09:25:06 karimmughal

我不認爲你已經理解了被問到的問題。 –

ui-widget是jquery-ui類，你可以使用它來輕鬆獲取

No search results.

– karimmughal

JQuery的自動完成，如果沒有找到數據，然後顯示通知

回答

相關問題