如何强制浏览器DOMDocument.ExecCommand（）函数注入默认字体

Question

方案标签： 我的web应用程序允许用户输入和发送电子邮件：

<div contenteditable="true">User can type email contents here</div> 

虽然他们正在撰写自己的电子邮件，他们有突出显示某些文本的能力，以及选择一种新字体以将该文本更改为。实现的方式是调用DOMDocument对象上的ExecCommand命令，以允许浏览器将此字体样式应用于突出显示的文本。

domDocument.ExecCommand("fontname", false, "Arial Black"); 

大多数浏览器应用此字体改变是注入一个标签到DOM周围高亮文本的方式：

<font face='Arial Black'> highlighted text here </font> Here is some more text that was not highlighted. 

也能正常工作的所有字体，除了浏览器的默认字体（” Times New Roman“（大多数浏览器）。如果我突出显示一些文本并选择“Times New Roman”，我注意到IE9 +已经进行了优化，以实现这种字体已经在'Times New Roman'中（因为它是默认的浏览器字体），并且不注入多余的标签放入DOM中。当电子邮件仍显示在当前浏览器中时，这很好，因为字体默认为“Times New Roman”。但是，当电子邮件发送并在另一个客户端打开时，标记不会随电子邮件一起发送，因为它从未注入到DOM中，因此呈现电子邮件的客户端可以使用它想要的任何默认字体，这是不必要的。新罗马'。

我创建了一个JSFiddle来显示这个问题。请参阅使用代码注释： http://jsfiddle.net/8xq4dpb2/1/

有没有人有任何想法将字体信息干净地注入页面？或者是手动“破解”DOM以包含此信息的唯一选择？

谢谢！

Answer 1

几点来考虑，而不是在你的DOM添加字体标签

1. 使用跨度。
2. 然后为该字段添加特定的字体类
3. 更好地使用Jquery调用函数而不是onClick（）内联函数调用。

我为您创建了一个解决方案请参考： - http://jsbin.com/janukeyeya/5/edit您可以看到div的字体切换。