javascript - RichEditor 使用 execCommand ('bold' ) 两次附加额外的 <span> 标签

标签 javascript html

我使用 execCommand('bold') 使以下文本变为粗体,但是当我再次尝试禁用粗体时,然后添加其他标签,如“h”或其他标签,它会添加额外的标签链接:

<h1><span style="font-weight: normal;">111</span></h1>

我想知道如何避免这种情况?

最佳答案

它应该有效
首先,如果你真的做得正确的话,就不会发生这样的事情。

请参阅下面的示例,它应该可以工作。

document.designMode = "on";

function myFunction(event) {
  if (event.keyCode == 16) {
    // Press shift btn exec cmd for bold trigger
    document.execCommand("bold");
    
    //check in alert box when triggered
    //alert( document.getElementById("thebody").innerHTML );
    
    //check the updated code in console once triggered
    console.log( document.getElementById("thebody").innerHTML );
  }
}
<!DOCTYPE html>
<html>
<body onkeydown="myFunction(event)">
<div id="thebody">
<h1>Exec execCommand("Bold")</h1>

<p>Try to exec by pressing shift btn once highlighed</p>

<h2>Again execCommand("Bold")</h2>
<p>Select some text in this page, and press the SHIFT button to make the selected text toggle between bold and normal.</p>
</div>

<div id="preview">
</div>
</body>
</html>

注意/建议:
但是,如果您的代码版本中问题仍然存在,请与我分享触发此 exec Cmd 的函数。

关于javascript - RichEditor 使用 execCommand ('bold' ) 两次附加额外的 <span> 标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59477616/

相关文章:

javascript - 我的推送菜单中的 body 动画不起作用

javascript - 在 Jquery 中隐藏除某个类的一个元素以外的所有元素

javascript - Angular ng-repeat $index

javascript - 使用 JavaScript 单击 HREF

javascript - JS-动态选择视频坐标

html - 条纹 tr 不包括子表

javascript - 提交时比较表中两个动态生成的列并显示警报

javascript - HTML 内容未获得 Jquery 点击功能

html - Bootstrap 3 : Can 'row' and 'col-xx-xx' classes be assigned to non-block leven elements?

html - 表格边框的左边缘在 Firefox 中被截断,但在 IE 6/7 和 Safari 中没有