位置: 编程技术 - 正文
推荐整理分享jQuery弹出下拉列表插件(实现kindeditor的@功能)(jquery实现下拉框),希望有所帮助,仅作参考,欢迎阅读内容。
文章相关热门搜索词:jquery操作下拉框,jquery 下拉框滚动加载数据,jquery实现下拉菜单,jquery怎么给下拉框赋值,jquery下拉框默认选中,jquery怎么给下拉框赋值,jquery怎么给下拉框赋值,jquery下拉列表,内容如对您有帮助,希望把文章链接给更多的朋友!
这几天有个工作需求,就是在富文本输入区域(kindeditor)可以有@功能,能够容易提示用户名的(像在qq群组@人一样)。在网上找了一个叫bootstrap-suggest的插件,却不能满足我的需求,于是我决定在该插件上改良,主要是下面几点:
1. @内容的输入,能够匹配多个属性值。
2. 选中列表值后,是成块插入kindeditor的(方便删除,也利于区分文本)。
3. 修正输入偶数关键字@功能失效问题。
前言
在一开始,我用bootstrap-suggest( 只能单一匹配(可能存在需要匹配拼音或中文)。
2. 偶数位的@功能会失效。
3. 选取值后,只是简单文本(没有qq一样那种成块效果)。
jquery-kindeditor-suggest
由于我不想重复造轮子,于是决定在上面插件做调整,以满足我的需求,有几个关键地方需说明。
1. startOffset取值错误问题。
如果使用了KindEditor的insertHTML,会导致下一次startOffset取值出错。原插件在获取光标位置(top,left)时,会需要插入一个span去获取,在获取完后删除,但是这时候下一次editor.cmd.range.startOffset;就出错。
于是我修改了插入的方式:
PS:在行。
2. 替换选择值
将@后面的输入内容删除(包含@),然后插入一个完整的标签(选择值),还要保证光标位置正确。
PS:在行。
修改后效果
内容是富文本输入区域,插入的成块文本。
总结
虽然是基于他人的插件,但我在修复问题上也花费了很多心思,之前一直发现没有精确针对kindeditord @功能的插件,所以我就自己弄了下。
我把源代码放在Github上了,有需要的可去下:
jQuery多文件异步上传带进度条实例代码 先给大家展示下效果图:///作者:柯锦///完成时间:..///多文件异步上传带进度条(function($){functionbytesToSize(bytes){if(bytes===0)return'0B';vark=,//orsiz
jquery过滤特殊字符',防sql注入的实现方法 今天写的代码给项目经理看了下,因为之前没有考虑sql注入的问题,然后在他测试我的code的时候,打了一个',然后我的程序就挂了!于是乎,我在网上
jQuery Easyui使用(二)之可折叠面板动态加载无效果的解决方法 在上篇文章给大家介绍了jQueryEasyui使用(一)之可折叠面板的布局手风琴菜单先上代码:htmlxmlns="
标签: jquery实现下拉框
本文链接地址:https://www.jiuchutong.com/biancheng/384086.html 转载请保留说明!友情链接: 武汉网站建设