元素的可编辑状态

使用 contenteditable 为元素添加该属性

css属性控制读写状态       user-modify    but只能在webkit内核下使用

contenteditable=""

contenteditable="events"

contenteditable="caret"

contenteditable="plaintext-only"

contenteditable="true"

contenteditable="false"

兼容代码

$('[contenteditable]').each(function() {// 干掉IE http之类地址自动加链接try {        document.execCommand("AutoUrlDetect", false, false);    } catch (e) {}        $(this).on('paste', function(e) {        e.preventDefault();        var text = null;            if(window.clipboardData && clipboardData.setData) {// IEtext = window.clipboardData.getData('text');        } else {            text = (e.originalEvent || e).clipboardData.getData('text/plain') || prompt('在这里输入文本');        }        if (document.body.createTextRange) {                if (document.selection) {                textRange = document.selection.createRange();            } else if (window.getSelection) {                sel = window.getSelection();                var range = sel.getRangeAt(0);// 创建临时元素，使得TextRange可以移动到正确的位置var tempEl = document.createElement("span");                tempEl.innerHTML = "&#FEFF;";                range.deleteContents();                range.insertNode(tempEl);                textRange = document.body.createTextRange();                textRange.moveToElementText(tempEl);                tempEl.parentNode.removeChild(tempEl);            }            textRange.text = text;            textRange.collapse(false);            textRange.select();        } else {// Chrome之类浏览器document.execCommand("insertText", false, text);        }    });});

整理自

http://www.zhangxinxu.com/wordpress/2016/01/contenteditable-plaintext-only/