且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

有没有办法使用jQuery UI自动完成的jQuery模板(官方插件)?

更新时间:2021-11-07 09:06:13

好的,jQuery UI使这个非常容易。来自 http://jqueryui.com/demos/autocomplete/#custom-data ,你可以改变.data()调用:

OK, jQuery UI makes this extremely easy. From the demo on page http://jqueryui.com/demos/autocomplete/#custom-data, you can just alter the .data() call:

//this is the original code in the demo
.data( "autocomplete" )._renderItem = function( ul, item ) {
    return $( "<li></li>" )
        .data( "item.autocomplete", item )
        .append( "<a>" + item.label + "<br>" + item.desc + "</a>" )
        .appendTo( ul );
};

并将其替换为.data()电话:

and replace it with this .data() call:

.data( "autocomplete" )._renderItem = function( ul, item ) {
    return $( "#myTemplate" ).tmpl( item ).appendTo( ul );
};

// template
<script id="myTemplate" type="text/x-jquery-tmpl">
    <li><a>${label}<br />${desc}</a></li>
</script>

这里是小提琴中的工作代码:
http://jsfiddle.net/swatkins/XXeDd/

and here's the working code in a fiddle: http://jsfiddle.net/swatkins/XXeDd/