execCommand 的替代品
我希望创建一个所见即所得编辑器,使用 jQuery 作为框架,我可以使用不同的方法来简化生产。
我现在确实有一个正在工作的编辑,而且运作良好。我使用 iFrame,并将其设计模式设置为打开并从那里开始。然而,有一些事情困扰着我。
以更改所选文本的字体系列为例。目前我正在使用这个:
editorDoc.execCommand('fontname', false, 'verdana');
…现在工作正常:它在 iFrame 中正确显示了更改。然而,当我实际查看代码时(我将 iFrame 内的任何代码复制到隐藏输入中,然后发布它),
<font class="Apple-style-span" face="verdana">aasdf</font>
我意识到 Apple-style-span 的第一类是 webkit 的东西,这并不重要。让我烦恼的是 的整个使用。
研究 execCommand 看起来它不是一个标准,尽管大多数浏览器都支持它。不过它已经很旧了,所以我想知道是否有人听说过或知道产生相同效果的更好方法,希望有一个更具语义的代码产品。如果不局限于 iFrame,而是能够使用
非常感谢, Gareth
编辑:contentEditable 可以帮助我实现不使用 iFrame 的目标吗?
I'm looking to create a WYSIWYG editor, using jQuery as a framework from which I can use different methods to ease production.
I do actually have a working editor at the moment, and it's working well. I use an iFrame, and set it's designMode to on and go from there. However there are a few things which are nagging me.
Take as an example changing the font family of the selected text. At the moment I am using this:
editorDoc.execCommand('fontname', false, 'verdana');
…now that works fine: it shows the change correctly in the iFrame. However, when I actually look at the code (I copy any code inside the iFrame into a hidden input and then POST it) it produces
<font class="Apple-style-span" face="verdana">aasdf</font>
I realise that the first class of Apple-style-span is a webkit thing, which doesn't matter. The thing which is nagging me is the whole use of <font>
.
Researching the execCommand it looks like it's not a standard, although most browsers do support it. It is old though, so I was wondering if anyone had heard or know of a better method of producing the same effect, with hopefully a more semantic code product. It would also be fantastic not to be limited to a iFrame, but to be able to use a <textarea>
instead..
Many thanks in advance,
Gareth
Edit: Could contentEditable help me with my aim to not use an iFrame?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
您可以使用常用的 DOM 方法对 iframe 的 DOM 进行任何您想要的操作。如果您需要一些见解,请查看 TinyMCE 的来源。
You can do any manipulations you want with iframe's DOM using usual DOM methods. Look in the sources of TinyMCE if you need some insights.