我需要你的幫助,我正在使用Autocomplete-Jquery。我需要在自動完成建議的下拉串列中加粗文本。我怎樣才能做到呢?請在這方面幫助我。謝謝。
這是我的代碼:
$(function() {
$("#age").autocomplete({
source: '{% url 'autocomplete' %}'。
appendTo: "#appendToHere"。
select: function(event, ui) {
selectedItem = ui.item.value。
document.getElementById("age").value = selectedItem。
$("#searchBtn").click()。
},
});
});
uj5u.com熱心網友回復:
請看下面的例子。
。$(function() {
var availableTags = [
"ActionScript"。
"AppleScript"。
"Asp",
"BASIC"。
"C"。
"C "。
"Clojure"。
"COBOL"。
"ColdFusion"。
"Erlang"。
"Fortran"。
"Groovy"。
"Haskell"。
"Java"。
"JavaScript"。
"Lisp"。
"Perl"。
"PHP"。
"Python"。
"Ruby"。
"Scala"。
"Scheme"。
];
function boldStr(needle, haystack) {
var regex = new RegExp(needle, 'i') 。
return haystack.replace(regex, "<span class='bold'>" needle "</span> ")。
}
$("#tags"/span>).autocomplete({
source: availableTags
}).autocomplete("instance")._renderItem = function(ul, item) {
return $("<li>"/span>)
.append("<div>" boldStr($("#tags"/span>) 。 val(), item.label) "</div>")
.appendTo(ul)。
};;
});
.bold {
font-weight: bold;
}
< link rel="styleheet" href="/code. jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code. jquery.com/jquery-1.12.4.js"></script>
<script src="https://code. jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div class="ui-widget">/span>
<label for="tags">/span>Tags。</label>
<input id="tags">/span>
</div>/span>
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" class="snippet-box-edit snippet-box-result" frameborder="0"></iframe>
您可以使用Replace來替換一個字串的一部分。參見更多。https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace
你可以使用擴展點來修改串列中的專案。請看更多。https://api.jqueryui.com/autocomplete/#method-_renderItem
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/319935.html
標籤:
