jquery.custom自动补全插件

来源:互联网 发布:雇网络维护人员要求 编辑:程序博客网 时间:2024/06/07 02:20

一、引入所需的js插件

<script type="text/javascript" src="js/jquery-1.10.0.min.js"></script><script type="text/javascript" src="js/jquery-ui-1.10.0.custom.js"></script>

二、html部分

<input id="conSearch" type="search" placeholder="搜索:用户/科室/讨论组" original-title="">

三、js部分

$('#conSearch').autocomplete({minLength: 1, source: function(search, response) {            $.get('ajax/getSearchRange.php', { search: search.term }, function(result) {                if (result.status == 'success' && result.data.length > 0) {                    $( "#conSearch" ).autocomplete( "option", "autoFocus", true );                    response(result.data);                } else {                    $( "#conSearch" ).autocomplete( "option", "autoFocus", false );                    response(['No search results...']);                }            });        },        focus: function(event, focused) {            event.preventDefault();        },        select: function(event, selected) {            event.stopPropagation();            if(!selected.item.conWith){                return false;            }            var conWith = selected.item.conWith;            var conType = selected.item.conType;            return false;        }    })        // customize internal _renderItem function to display groups and users differently        .data("ui-autocomplete")._renderItem = function( ul, item ) {        var insert = $( "<a>" );        var text = "";        if(item.conType == 'user'){            text = item.conWith  + '(user)';        }else if(item.conType == "group"){            text = item.conWith + '(group)';        }else if(item.conType == "tempgroup"){            text = item.conWith + '(tempgroup)';        }else{            text = item.value;        }        insert.text( text );        if(item.conType == 'group' || item.conType == 'tempgroup') {            insert = insert.wrapInner('<strong></strong>');        }        return $( "<li>" )            .addClass(item.conType)            .append( insert )            .appendTo( ul );    };

demo下载地址 http://download.csdn.net/detail/jiangjundriver/9872416

原创粉丝点击