可编辑div:contenteditable之ctrl+enter换行,enter发送
2017-07-15 03:01
344 查看
项目中遇到需要在输入文字的同时输入表情,web微信用的pre,没搞懂怎么弄,所以用了可编辑div。。
//发送消息可编辑div //回车发消息 $("#textarea").keydown(function($event){ var keycode = window.event ? $event.keyCode : $event.which; var evt = $event || window.event; var inputTxt = $(this); // 回车-->发送消息 if (keycode == 13 && !(evt.ctrlKey)) { // 发送消息的代码 woohecc.send_msg(); $event.preventDefault(); return false; } // ctrl+回车-->换行 if (evt.ctrlKey && evt.keyCode == 13) { inputTxt.html(inputTxt.html() + '<br>'); woohecc.placeCaretAtEnd(inputTxt.get(0)); return false; } });
var woohecc = { placeCaretAtEnd : function(el) { el.focus(); if (typeof window.getSelection != "undefined" && typeof document.createRange != "undefined") { var range = document.createRange(); range.selectNodeContents(el); range.collapse(false); 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(false); textRange.select(); } }, }
相关文章推荐
- div,contenteditable编辑器之ctrl+enter换行,enter发送
- 仿微信div可编辑ctrl+enter换行,enter发送
- div,contenteditable编辑器之ctrl+enter换行,enter发送
- div,contenteditable编辑器之ctrl+enter换行,enter发送
- div可编辑之contenteditable属性 二
- div可编辑contentEditable和designMode
- div可编辑之contenteditable属性
- enter键发送,ctrl+enter换行
- 可编辑的div,focus之后,光标怎么定位到文本最后
- 可编辑的DIV
- 怎样使可编辑的DIV固定大小,当内容多时,就自动出现滚动条
- 2017-02-20 可编辑div中如何在光标位置添加内容
- Enter 发送,Ctrl+Enter 换行
- 用户界面的设计和实现(DIV+CSS,可编辑的TreeView用户控件)
- 可编辑的div中光标位置插入对应内容(img,字符串------)
- Delphi中使用TRichEdit或TMemo模仿QQ按Ctrl+Enter发送信息,屏蔽换行
- 可编辑 DIV 兼容 chrome,ie9-10,ie11改进
- mouseenter mouseleave 鼠标经过div边框变色,点击跳到相应链接
- 如何让DIV可编辑、可拖动示例代码
- 如何让DIV可编辑、可拖动示例代码