我正在尝试将wysiwyg实现到应用程序中,它们都使用contentEditable
这很酷,直到我将整个html文档放入文本框中。每个wysiwyg使用html()
和innerHTML
来移动内容以及这些条带和标签......
html = "<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>Title</title>
</head>
<body>
<span>Hey There</span>
</body>
</html>
"
editable.innerHTML = html
editable.innerHTML
// => "
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Title</title>
<span>Hey There</span>
"
与$(editable).html()
完全相同的事情。我找不到有关此的规范。
做什么?
答案 0 :(得分:1)
HTML文档只能包含一个html
,body
和head
元素,而您的主页已经包含这些元素。它正在剥离它,因为你试图将它们插入不允许的位置。
您必须完全删除它们,然后在编辑元素内容后重新添加它们,或者将整个WYSIWYG编辑器放在iframe
元素中,以便拥有整个iframe文档使用而不是单个元素。
记录在案,尽管您需要知道自己在寻找什么。请参阅MDN上的<body>
文档:
允许的父元素:它必须是元素的第二个元素。
以及<html>
的文档:
允许的父元素:作为文档的根元素,或复合文档中允许使用子文档片段的任何位置。