Jquery插件SimpleUI实现淘宝搜索下拉提示

4ngel’s blog ( http://www.sablog.net/blog/ ) :

最近发现一个JQuery插件SimpleUI，可以实现淘宝搜索下拉提示的功能。马上看了看。立即决定为我的淘宝比比加上这个功能。

调用很简单。当然事先肯定要加载JQuery。

<script type="text/javascript" src="js/SimpleCore.js"></script>
<script type="text/javascript" src="js/SimpleAutoComplete.js"></script>

然后用下面的代码就可以实现了。

<script type="text/javascript">
$("#input_search_text").autocomplete({
	source: function(val, parse){
		$.ajax({
			url:"http://suggest.taobao.com/sug?code=utf-8&callback=?",
			data:{
				q:val
			},
			dataType:"jsonp",
			success:function(r){
				parse(r);
			}
		});
	},
	format:function(value,item){
		var itemText=item[0].replace(value, "<b class='orange'>" + value + "</b>"),
		li=$("<li/>").html(itemText).data("value",item[0]);
		return li;
	},
	isResult:function(data){
		return data.result.length;
	},
	dealData:function(data){
		return data.result;
	},
	onselect:function(val){
		Simple.log(val);
	}
})
</script>

SimpleUI下载地址：www.simpleui.org

效果演示地址：http://www.taobaobibi.com/ 或者 http://www.tbbibi.com/

转载请注明：爱开源 » Jquery插件SimpleUI实现淘宝搜索下拉提示