添加自定義標籤，就能自動

我使用的是自動完成的jQuery中，如下：添加自定義標籤，就能自動

$("#myDiv").autocomplete({ 
}

這是標準的jQuery自動完成功能：HTTP：//jqueryui.com/demos/autocomplete/

生成的li標籤是否可以修改爲包含額外的標籤？

<li class="ui-menu-item" role="menuitem"><a class="ui-corner-all" tabindex="-1">Erlang</a></li> 
<a class="ui-corner-all" tabindex="-1">Erlang</a> 
<li class="ui-menu-item" role="menuitem"><a class="ui-corner-all" tabindex="-1">Erlang</a></li>

變（加入測試儀）：

<li class="ui-menu-item" mytag="tester" role="menuitem"><a class="ui-corner-all" tabindex="-1">Erlang</a></li> 
<a class="ui-corner-all" tabindex="-1">Erlang</a> 
<li class="ui-menu-item" role="menuitem"><a class="ui-corner-all" tabindex="-1">Erlang</a></li>

來源

2012-09-12 blue-sky

在這一點你要買添加'mytag'屬性？另外，你應該注意，如果你想讓你的HTML有效，那麼這個屬性應該被稱爲'data-mytag'，並且你不能在'li'之間放置'a'元素。 –

@Rory McCrossan應該在頁面加載時添加'mytag'屬性「你不能在li之間放置一個元素」，那麼jQuery的自動完成功能呢，那麼看起來它是一個e元素，可以放置一個li？ –

使用焦點回調函數。事情是這樣的......

$(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" 
    ]; 

    $("#tags").autocomplete({ 
    source: availableTags, 
    focus: function(event, ui) { 
     $(".ui-autocomplete li").attr("mytag", "tester"); 
    } 
    }); 
});

入住這一點 - http://jsfiddle.net/gtND8/

來源

2012-09-12 12:15:40 bhb

如果我得到你的權利，那麼你可以使用_renderItem做這件事，如：

_renderItem: function(ul, item) {   
    return $("<li></li>") 
     .data("item.autocomplete", item) 
     .append("<a>"+ item.label + "</a>") 
     .after("<a>"+ item.label + "</a>").addClass("ui-corner-all") 
     .attr("tabindex", -1) 
    .appendTo(ul); 
}

顯示HTML爲：

<li class="ui-corner-all ui-menu-item" tabindex="-1" role="menuitem"> 
    <a class="ui-corner-all" tabindex="-1">Erlang</a> 
</li> 
<a class="ui-corner-all" tabindex="-1">Erlang</a> 
<li class="ui-corner-all ui-menu-item" tabindex="-1" role="menuitem"> 
    <a class="ui-corner-all" tabindex="-1"><strong>Erlang</strong></a> 
</li> 
<a class="ui-corner-all" tabindex="-1"><strong>Erlang</strong></a>

你的意思是這樣的..

來源

2012-09-12 12:13:51

添加自定義標籤，就能自動

回答

相關問題