Question

是否有一些自动完成jQuery插件，我可以在resultblock中添加一些可点击的块？像结果的页眉或页脚，我可以放置一些复选框并再次处理结果。

Answer 1

最简单的方法是使用您自己的_renderMenu函数扩展jQuery UI自动完成。

http://jqueryui.com/demos/autocomplete/#default

HTML：

<div class="ui-widget">
    <label for="tags">Tags: </label>
    <input id="tags">
</div>

jQuery的：

$(function () { //DOM Ready
    var availableTags = [
        "ActionScript",
        "AppleScript",
        "Asp",
        "BASIC",
        "C",
        "C++",
        "Clojure",
        "COBOL",
        "ColdFusion",
        "Erlang",
        "Fortran",
        "Groovy",
        "Haskell",
        "Java",
        "JavaScript",
        "Lisp",
        "Perl",
        "PHP",
        "Python",
        "Ruby",
        "Scala",
        "Scheme"];

   $.widget( "custom.customcomplete", $.ui.autocomplete, {
       // our fancy new _renderMenu function adds the header and footers!
       _renderMenu: function( ul, items ) {
            var self = this;
            $.each( items, function( index, item ) {
                if (index == 0)
                    ul.append( '<li><input type="checkbox"> I\'m at the top! Choose me!</li>' );
                self._renderItem( ul, item );
                if(index == items.length - 1)
                    ul.append( '<li><input type="checkbox"> I\'m at the bottom! Choose me!</li>' );
            });
        }
   });

   // note the new 'widget', extended from autocomplete above
   $( "#tags" ).customcomplete({
       source: availableTags
   });

});

请参阅此处的工作示例：http://jsfiddle.net/kJUdt/

jQuery样式自动完成与页眉/页脚

1 个答案: