可编辑div:contenteditable之ctrl+enter换行,enter发送

项目中遇到需要在输入文字的同时输入表情,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();
            }
        },
    }

猜你喜欢

转载自blog.csdn.net/a5816138/article/details/75142479