我有一个 contentEditable div
用户可以在其中输入。用户可以使用鼠标滚轮更改 font-size
的 div
.
我面临的问题:如果 div
为空,用户更改了 font-size
插入符大小不会改变:这种行为可能会导致对实际 font-size
的一些混淆正在使用。一旦用户开始输入,插入符就会调整到正确的大小。
这是更改 css font-size
的代码:
$("#textBox").css("font-size", fontSize);
用户打开应用程序(默认字体大小,插入符正确)
用户将字体大小更改为 100(插入符大小不根据字体大小更改):
用户开始输入(插入符最终更新):
我试图更改 div
的内容当字体为空时调整字体大小时,但它不会更新插入符号:
if (realContent.length == 0) {
console.log("empty");
$("#textBox").text(" ")
$("#textBox").text("")
}
如何“刷新”div 并强制更新插入符大小?
最佳答案
CSS 更改后,blur()
元素,然后 focus()
它在 setTimeout 为 0 之后。 (出于某种原因,如果没有 setTimeout,它就无法工作)
https://jsfiddle.net/ber8ouu3/5/
var textbox = document.querySelector('#textBox');
textbox.addEventListener('wheel', function(e) {
e.preventDefault();
$("#textBox").css("font-size", 80);
textbox.blur();
setTimeout(function() { textbox.focus(); });
});
div {
border: 1px solid black;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div contenteditable="true" id="textBox"></div>
关于javascript - 在更改 contentEditable div 的 css 字体大小后直观地更新插入符大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49595142/