我正在构建一个带有粗体功能的简单JavaScript文本编辑器。我为此使用execCommand('bold')
。对于工具栏中的粗体图标,我必须检查我现在是否正在写粗体。我想到的是每次执行命令时都会设置的布尔变量,但这是不可能的,因为可以选择文本,依此类推。
那么有没有办法确定execCommand('bold')是否正在立即执行?
答案 0 :(得分:1)
您需要Document.queryCommandState()方法。
bolder.onclick = e => {
document.execCommand('bold');
};
inp.onfocus = document.onselectionchange = e =>
bolder.classList.toggle('active', isWritingBold());
function isWritingBold() {
return document.queryCommandState('bold');
}
#bolder.active::before {
content: 'un-';
}
<button id="bolder">boldify current selection</button>
<div id="inp" contenteditable>edit me and <b>boldify</b> any part of my content</div>