
插件简介:
英文说明:http://loopj.com/2009/04/25/jquery-plugin-tokenizing-autocomplete-text-entry/
类似google搜索的自动完成的功能,但UI有所增强。内含二个皮肤,其中个人比较推崇facebook的那个样式。大家可以看截图和演示
目前这个插件完美支持英文,但在中文输入的有bug,就是你输入完中文后,退删除一个字符,才会触发ajax事件。之前有好几个朋友向我询问解决方案。
现在已经解决这一个问题,其实只要把keydown换为keyup即可。中文示例与修改后的源代码请看压缩包
插件使用说明:
第一步:引进JQ库和插件JS文件,还有CSS文件
- <script src="jquery-1.3.2.min.js" type="text/javascript"></script>
- <script src="jquery.tokeninput.js" type="text/javascript"></script>
- <link href="token-input-facebook.css" rel="stylesheet" type="text/css" />
- <link href="token-input.css" rel="stylesheet" type="text/css" />
其中的token-input-facebook.css,就是我所说的facebook样式。
第二步:初始化插件
- $("#tokenize").tokenInput("./test.php", {
- hintText: "Type in the names of your favorite TV shows",
- noResultsText: "No results",
- searchingText: "Searching..."
- });
第三步:服务器端编程(这里使用php)
关键点说明:插件会向服务器端传输查询字段q,使用的是get方法。所以服务器端通过截取q值,来提取数据库的数据,php中:
$_GET['q']。最后返回的必须是json数据结构:
- [{"id":"856","name":"House"},
- {"id":"1035","name":"Desperate Housewives"},
- {"id":"1048","name":"Dollhouse"},
- {"id":"1113","name":"Full House"}
- ]

已加你连接,希望回连,谢谢
不好意思,请问你加了吗
初始化已选如何初始化
$(“#tokenize”).tokenInput(“./test.php”, {
hintText: “Type in the names of your favorite TV shows”,
noResultsText: “No results”,
searchingText: “Searching…”
});
这样写初始化函数就行了。最关键的是要写上服务器端url地址
还有问题,可以联系我QQ:24414976
QQ号码写错了呢,差点加错了呢
建议把你的share插件换成jiathis这个我也是刚刚发现的,它比addthis更中国化!
谢谢提醒,实际上我都不喜欢这些分享按钮,因为不是有加版权标示,就是要经过分享网站后再跳转,让人不爽。打算自己写个
博主的博客不错,看了我们的方向是相同的……
我的博客:http://www.wsria.cn
也是阐释RIA的东西,呵呵
留个脚印
这东西正在用,不过我要初始化是一个大问题?有解决方案没?
你好!博主,这几天在看 tokeninput 的实现, 发现ie下有bug。
在官方demo的最后一个例子中(下拉选项中有图片的那个),在ie下根本不出来。 还有就是ie下中文文字会乱码。
请教一下怎么解决
还有就是有没有更好的类似的插件(目前我发现这个挺不错)
谢谢
@luol17, 补充一下
就是输入中文的时候,比如输入“五”的时候 我输入w字母 时,不会有提示显示出来,请问怎么解决
输入中文的确有很大问题,解决方法是加延迟。需要改源码,在keyup内加些延迟时间。