如何保持文本选择使用数字输入来改变fontSize的

我想通过一个div元素上使用contenteditable创建一个小的使用RichTextEditor的时候，但我已经遇到了一个问题：如何保持文本选择使用数字输入来改变fontSize的

我希望能够改变当前选择的fontSize ，但是当我使用数字输入字段时，我丢失了当前选择，因此document.execCommand('fontSize,false,myNumberValue)不起作用。使用<button>元素来执行命令行不通，但我宁愿使用数字字段，我的选择家伙是什么？

来源

2013-09-25 Mervin

您可以保存范围（选定文本），然后在需要时重新设置文本范围。 https://developer.mozilla.org/en-US/docs/Web/API/range –

我已经运行（正在运行）到这个问题以及。这是一个痛苦，但我只是发现没有办法，除了保存/恢复像Erik提到的选择。

围绕它的一种可能的方式是将输入放入模式中，以使灰色区域变得灰白，但即使如此，它仍然只是一种工作。只是帮助用户体验。

这是我用来做一些非常相似的小片段。

saveSelection : function(){ 
    var sel = window.getSelection(), ranges = []; 
    if (sel.rangeCount) { 
     for (var i = 0, len = sel.rangeCount; i < len; ++i) { 
      ranges.push(sel.getRangeAt(i)); 
     } 
    } 
    return ranges; 
}, 
restoreSelection : function(savedSel){ 
    var sel = window.getSelection(); 
    sel.removeAllRanges(); 
    for (var i = 0, len = savedSel.length; i < len; ++i) { 
     sel.addRange(savedSel[i]); 
    } 
}

这似乎在大部分现代浏览器的工作对我来说器（Chrome，Safari浏览器，IE9 +），但如果你需要它来支持旧的浏览器，你可能需要考虑瘦长 - https://code.google.com/p/rangy/

来源

2013-09-25 13:27:15

啊，这是一个好主意，我还没有想到它，运作良好。谢谢：） – Mervin

如何保持文本选择使用数字输入来改变fontSize的

回答

相关问题