js -- 设置输入框光标位置(在模拟微信表情输入的时候遇到的)
2017-08-17 11:36
483 查看
项目中需要自己制作一个类似微信表情包输入的效果,在输入表情的时候光标总是显示在刚刚输入的表情的前面,再输入文字的时候会在这个表情前面显示,而输入表情则正常显示。此时就需要利用js设置光标的位置
// true 为开始位置,false 为末尾 function placeCaret(el, atStart) { el.focus(); if (typeof window.getSelection != 'undefined' && typeof document.createRange != 'undefined') { var range = document.createRange(); range.selectNodeContents(el); range.collapse(atStart); var sel = window.getSelection(); sel.removeAllRanges(); sel.addRange(range); } else if (typeof document.body.createTextRange != 'undefined') { var textRange = document.body.createTextRange(); textRange.moveToElementText(el); textRange.collapse(atStart); textRange.select(); } } // 注意使用的位置要在添加表情的打码的后面 placeCaret(document.querySelector('article'), false);
相关文章推荐
- UITextView自适应高度,同时可以设置最大高度, 类似于QQ微信输入框效果,支持表情的输入
- 使用C#模拟键盘输入、鼠标移动和点击、设置光标位置及控制应用程序的显示
- js 获取/设置文本输入域内光标的位置的方法
- [转]JS 获取、设置 输入框光标位置
- js获取和设置文本框光标的位置
- js定位光标到输入框指定位置
- EditText 在设置为输入密码的时候 密码是否可见 光标在最后显示
- js获取文本框(或文本域)光标位置以及设置光标位置
- JS设置光标位置--转载,不懂
- EditText的换行输入、输入起始位置、调用指定格式的系统键盘(显示和隐藏),光标颜色,密码动态设置可见性
- JS获取和设置光标的位置
- iOS---设置输入框的光标位置
- js判断input输入框为空时遇到的问题 弹窗后,光标没有定位到输入框,而是直接执行我的处理页面程序
- 用js做一个输入框,在用户没有输入的时候不能提交并提示
- js去当输入框输入数值的时候去除所有的空格和禁止输入空格
- js获取光标位置和设置文本框光标位置
- [图解]在输入框和文本框中获取和设置光标位置,以及选中文本和获取选中文本值的方法 --- 详解,兼容所有浏览器。
- JS在可编辑的div中的光标位置插入内容或表情
- 输入框中获取当前光标位置&设置光标位置