位置: 编程技术 - 正文

jQuery弹出下拉列表插件(实现kindeditor的@功能)(jquery实现下拉框)

编辑:rootadmin

推荐整理分享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取值错误问题。

jQuery弹出下拉列表插件(实现kindeditor的@功能)(jquery实现下拉框)

如果使用了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 转载请保留说明!

上一篇:深入理解(function(){... })();(深入理解新发展理念心得体会3篇)

下一篇:jQuery多文件异步上传带进度条实例代码(jquery 异步加载)

  • 期末应交税费有余额吗
  • 查询一般纳税人资格证明
  • 如何查看发票是否被抵扣
  • 印花税申报减免额不能为0怎么报
  • 员工继续教育培训费计什么科
  • 税控设备抵减增值税政策
  • 购进的库存商品转自用需要开发票吗
  • 合同签订之后国家降税怎么办?
  • 公户可以在淘宝下单吗
  • 企业个人完税证明怎么开
  • 开票系统里的开户行可以更改吗
  • 试运营和正式运营间隔
  • 经营租赁固定资产折旧计入什么科目
  • 工资条上税基调整是啥意思
  • 增值税包括土地整治收入吗
  • 公司租车交税
  • 电脑经常蓝屏修复
  • win7s
  • 股东分红个税怎么做账
  • 7zip怎么压缩文件为rar
  • php技巧
  • 提租补贴应计入什么科目
  • 圣诞精灵什么意思
  • threejs怎么用
  • echarts series name
  • 文心一言中国版
  • 你还没等于几
  • php执行系统命令函数
  • 残障金什么时候开始交
  • tmux复制粘贴
  • 工伤保险赔付计算
  • 建筑业总包增值税
  • 汇兑损益是资产类科目
  • phpcms生成html
  • 购入项目用仪器怎么做账
  • 占地面积法如何分摊土地成本
  • 汇算清缴的费用标准 中汇
  • 企业销售商品满足收入确认条件时,应当
  • 长期股权投资会计准则2021修订
  • 兼职工资帐务处理
  • 经营性应收项目的减少调增 为什么是减
  • 代扣代缴增值税如何申报抵扣
  • 主营业务成本是借增贷减吗
  • 单位订购价格
  • 期末结转主营业务成本
  • 厂房出租租金收税吗
  • 土地承包经营合同生效条件
  • 支付收购股权款如何做账
  • 单位伙房费用管理制度
  • 售房中心给客人怎么说
  • 劳动关系从什么时候确立
  • mysql基本介绍
  • mysql 查找
  • xampp网页服务器配置文件名
  • freebsd12安装
  • 老毛桃u盘启动制作工具如何把原来的win7改xp系统图文教程
  • win8系统怎么把字体调大
  • linux终端怎么运行
  • win7防病毒设置在哪
  • 系和系怎么区分
  • Linux系统中修改文件权限
  • ubuntu with linux
  • 笔记本用linux系统
  • Win10系统照片应该打不开
  • win70
  • perl中\s+
  • js实现功能
  • perl格式化输出
  • js用变量值做参数
  • 设计一个windows
  • python中生成随机小数的函数
  • nodejs读取文件和写文件的方法
  • jquery绑定事件和移除事件
  • unity与android交互详细
  • unity教程完整版
  • jquery获取当前地址
  • android数据存储与访问的方式有
  • 百旺开票人怎么把管理员改成人名
  • 领的增值税发票怎么读入?
  • 税务24号公告
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设