div contentEditable 为true 可编辑状态时,如何在光标处通过一个标签模拟的按钮点击插入图片呢

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了div contentEditable 为true 可编辑状态时,如何在光标处通过一个标签模拟的按钮点击插入图片呢相关的知识,希望对你有一定的参考价值。

button下好像可以,其他a标签就不行

参考技术A 设 a标签的display属性block;
例如:<a href="" style="display:block;"></a>本回答被提问者采纳

div设置contenteditable="true",即可编辑,但无法去除从网页粘贴过来内容的格式

求粘贴时过滤html格式的方法
js处理

<div contenteditable="true" id="t"></div>
<script>
var d = document.getElementById( "t" );
document.addEventListener( "keyup", function() 
d.innerHTML = d.innerHTML.replace( /<[^>]*>/g, "" );
 );
</script>

参考技术A 你可以在记事本里面粘贴过一篇,再粘贴过去,从网页或word上复制下来的内容都带有自动生成的HTML代码的,从记事本里面可以把这些杂的东西去掉 参考技术B 给个思路
判断div是否变化,发生变化,获取div内容,用正则去掉里面的格式(去百度),在把内容放回div里.

日了 忘记看时间了 11年的
参考技术C

兼容ie11,edge,chrome,firefox,safari:

var element = document.createElement('div');
    element.contentEditable = true;
    element.addEventListener("paste", function (e)
        e.stopPropagation();
        e.preventDefault();        var text = '', event = (e.originalEvent || e);        if (event.clipboardData && event.clipboardData.getData) 
            text = event.clipboardData.getData('text/plain');
         else if (window.clipboardData && window.clipboardData.getData) 
            text = window.clipboardData.getData('Text');
                if (document.queryCommandSupported('insertText'))             document.execCommand('insertText', false, text);
         else             document.execCommand('paste', false, text);
        
    );

参考技术D <div id="editArea" contenteditable oninput="this.innerHTML = this.innerText"></div>

以上是关于div contentEditable 为true 可编辑状态时,如何在光标处通过一个标签模拟的按钮点击插入图片呢的主要内容,如果未能解决你的问题,请参考以下文章

div设置contenteditable="true",即可编辑,我想做一个按钮,点击它之后,焦点处就自动出现一个可编辑的

苹果手机IOS中div contenteditable=true无法输入

div contenteditable='true'去除word粘贴的样式

contenteditable="true"让div可编辑

contenteditable设置元素可编辑

div设置contenteditable="true",即可编辑,但无法去除从网页粘贴过来内容的格式