jQuery 自动补全插件
jQuery 自动补全插件有很多,找了一圈,没找到自己想要的。干脆自己编一个吧 哄哄
使用场景:
使用 B3log Solo 发布文章时,标签(tag)的提示。
具体需求:
1. 当标签输入框被 focus 后,提示以往用过的所有标签
2. 可以使用上下键或鼠标移动进行需要标签的选择
3. 根据当前选中标签,可用 enter 键或鼠标点击进行确定,该标签就会相应的补全到标签输入框中
4. 使用逗号分隔后,还可继续进行提示
5. 根据当前光标所在位置的标签,可进行该标签的相应提示
限制:
目前只能使用英文逗号进行分隔。
Javascript Code:
https://bowknot.googlecode.com/svn/trunk/bowknot/web/development-bundle/js/lib/completed.js
CSS Code:
.completed-panel{ background-color:#E3E9FF; border:1px solid #555; display:none; padding:2px; position:absolute; color:#00C; overflow:auto; } .completed-panel a { display: block; text-decoration: none; } .completed-panel a.selected { font-weight: bold; background-color:#BCF; }
HTML Code:
<input id="completed" type="text" style="width:100%;"/> <script type="text/javascript"> $("#completed").completed({ height: 160, data: ["asss", "ddd"] }); </script>
PS:
本来以前写过一个,但是代码被压缩了 5555~~~ 不过那个功能不全, bug 也比较多。
今天下午大部分重写了下,悲剧的是没戴眼镜。搞的我头昏眼花啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊~~~~~~~~~~
眼睛朦胧的我要先闪了,bug 慢慢再完善 HOHO
本文是使用 B3log Solo
从 Vanessa
进行同步发布的