我使用此腳本http://jqueryui.com/demos/autocomplete/#default與數據庫。我想突出顯示類似這樣的單詞:www.docs.jquery.com/Plugins/Autocomplete。請幫幫我。如何突出顯示單詞jquery ui自動完成
4
A
回答
2
看起來像什麼在http://docs.jquery.com/Plugins/Autocomplete上運行有一個突出顯示的方法。
您可以通過抓取正則表達式的亮點方法,並用它來修改你的結果送回到從您的Ajax請求您重新創建該數據庫:
$("#example").autocomplete({
source: function(request, response) {
$.ajax({
url: "search.php",
dataType: "json",
data: request,
success: function(data) {
var regex = new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + request.term.replace(/([\^\$\(\)\[\]\{\}\*\.\+\?\|\\])/gi, "\\$1") + ")(?![^<>]*>)(?![^&;]+;)", "gi");
var result = $.map(data, function(value){
return value.replace(regex, "<strong>$1</strong>");
});
response(result);
}
});
}
});
它很可能是聰明添加<strong>
在服務器端換行,因爲它很可能已經循環遍歷每個結果。
2
我不得不根據本Highlight jQuery UI autocomplete修改代碼,使其工作
$("#searchBox").autocomplete({
source: function(request, response) {
$.ajax({
url: "search.php",
dataType: "json",
data: request,
success: function(data) {
var escapedTerm=request.term.replace(/([\^\$\(\)\[\]\{\}\*\.\+\?\|\\])/gi, "\\$1");
var regex = new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + escapedTerm + ")(?![^<>]*>)(?![^&;]+;)", "gi");
var result = $.map(data, function(value){
//console.log(value);
value.label=value.label.replace(regex, "<span class='highlight'>$1</span>");
return value;
});
response(result);
}
});
},
minLength: 3
})
.data('autocomplete')._renderItem = function(ul, item) {
return $("<li></li>")
.data("item.autocomplete", item)
.append('<a>' + item.label + '</a>')
.appendTo(ul);
};
相關問題
- 1. 突出顯示jQuery UI自動完成
- 2. 如何突出顯示自動完成中的輸入單詞jquery ui
- 3. jquery ui自動完成顯示提示?
- 4. Bash自動完成突出顯示
- 5. 顯示微調jQuery-ui自動完成
- 6. jquery UI自動完成顯示ID
- 7. 突出顯示查詢jQuery自動完成動態列表源
- 8. jquery UI自動完成下拉列表不顯示出來
- 9. jQuery UI自動完成:菜單不顯示
- 10. 如何在JQuery自動完成UI中顯示Json數據?
- 11. JQuery UI自動完成在自動完成中顯示多個項目
- 12. jQuery UI自動完成示例
- 13. jquery ui自動完成 - 如何?
- 14. 如果沒有結果,jQuery UI自動完成顯示
- 15. jQuery ui自動完成
- 16. jquery ui自動完成
- 17. 的jQuery UI自動完成
- 18. jQuery UI的自動完成
- 19. jQuery UI自動完成
- 20. jquery ui自動完成
- 21. Jquery UI自動完成
- 22. jquery ui自動完成 - 滾動條不顯示在手機上
- 23. 如何突出顯示替換所選單詞的單詞?
- 24. :如何用jQuery突出顯示某些單詞
- 25. 在longpress上突出顯示單詞android
- 26. jquery自動完成結果顯示爲單個字母,而不是單詞
- 27. 轉到哪裏單詞突出顯示
- 28. 如何以html格式動態突出顯示一些單詞
- 29. 在Windows上的IPython - 沒有突出顯示或自動完成
- 30. 使用XML突出顯示自動完成
你的第二個鏈接不起作用不知道你想要什麼 – mcgrailm 2010-06-16 12:52:48