使用 JavaScript PasteHTML 函数插入自定义 html 标签

发布于 2024-10-02 22:17:32 字数 644 浏览 0 评论 0原文

我正在使用可编辑的 iframe 创建自定义 WYSIWYG。我想将自定义 html 标签添加到选定的文本，例如 some content here。我使用了此代码

Editor = document.getElementById('iframe_id').contentWindow.document;
var tag='info'
var range = Editor.selection.createRange();
if (range.pasteHTML)
{
 var content=Editor.selection.createRange().htmlText
 content1="<"+tag+">"+content+"</"+tag+">"
    range.pasteHTML(content1);
}

此代码适用于 IE。在 content1 中得到了正确的文本。但在输出中，起始标记 ; 没有得到。我已经使用 document.createElement('info'); 创建了该元素；我如何解决这个问题。提前致谢。

原文

I am creating a custom WYSIWYG using editable iframe.I want to add a Custom html tag <ino> to a selected text like <info>some content here</info>.I have used this code

Editor = document.getElementById('iframe_id').contentWindow.document;
var tag='info'
var range = Editor.selection.createRange();
if (range.pasteHTML)
{
 var content=Editor.selection.createRange().htmlText
 content1="<"+tag+">"+content+"</"+tag+">"
    range.pasteHTML(content1);
}

This code is for IE.In content1 am getting the correct text.But in output, the starting tag <info> is not getting .I have created the element using document.createElement('info');How i can solve this problem.Thanks in advance.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

兔小萌 2024-10-09 22:17:32

没有 HTML 元素。这很可能是您的代码无法正常工作的原因。

如果你确实需要这样做（我不明白为什么你会这样做），你可以利用 IE 允许你使用 document.createElement() 创建无效的 DOM 元素这一事实并做一些事情如下所示，粘贴标记元素，将包含原始 TextRange 内容的元素放置在标记元素之前，然后删除标记：

var range = Editor.selection.createRange();
var info = Editor.createElement("info");
info.innerHTML = range.htmlText;
var id = "some_random_id";
range.pasteHTML('<span id="' + id + '"></span>');
var span = Editor.getElementById(id);
span.parentNode.insertBefore(info, span);
span.parentNode.removeChild(span);

There is no HTML <info> element. This could well be the reason that your code is not working.

If you really need to do this (I can't see why you would), you could take advantage of the fact that IE allows you to create invalid DOM elements using document.createElement() and do something like the following, which pastes in a marker element, positions an <info> element containing the original TextRange content before the marker element and then removes the marker:

var range = Editor.selection.createRange();
var info = Editor.createElement("info");
info.innerHTML = range.htmlText;
var id = "some_random_id";
range.pasteHTML('<span id="' + id + '"></span>');
var span = Editor.getElementById(id);
span.parentNode.insertBefore(info, span);
span.parentNode.removeChild(span);

回复收藏 0 原文

孤独陪着我 2024-10-09 22:17:32

正如此链接中所述：http://msdn。 microsoft.com/en-us/library/ms536656%28VS.85%29.aspxpasteHML 仅接受 HTML 标记。
您可以使用 innerHTML 属性代替：

range.innerHTML = content1;

As it says in this link:http://msdn.microsoft.com/en-us/library/ms536656%28VS.85%29.aspx pasteHML only accepts HTML tags.
You can use innerHTML property instead: