gpt4 book ai didi

javascript - Tinymce更改完整的html文档

转载 作者:行者123 更新时间:2023-11-28 01:27:16 24 4
gpt4 key购买 nike

我正在尝试将完整的 html 文档加载到 TinyMCE 中。我已经能够完成此任务,但是当我检查 DOM 时,我发现它实际上不是我的完整文档。 Body 标签已更改为 TinyMCE 中的 Body 标签,并且 head 标签中缺少一些内容。

我需要我的 body 标签类和属性,因为我具有从 body 标签向下确定的功能和样式范围。因为我的标签不存在,所以我的页面已损坏,并且我无法选择更改 html 文档。

为什么 Tinymce 不能按原样使用我的文档并向其添加功能?

这是我的初始化程序。

tinymce.init({
selector: "textarea",
menubar:false,
statusbar: true,
entity_encoding : "raw",
plugins: ["paste fullpage image link textcolor"],
paste_text_sticky : true,
toolbar: "SAVE | RENAME | DELETE | WBW | SOURCE | forecolor | image | link ",
height : 650,
document_base_url: baseURL,
file_browser_callback: function(field_name, url, type, win) {
img_file_node = win.document.getElementById(field_name);
if(type=='image') {
htmlEditor.find('#my_form input').click();
}
},
setup : function(ed) {
//adding buttons here
}
});

编辑:

这是我的 html 示例

<body class="myprod-class" data-product="myprod" data-template="spread-template">
<section class="card">
<figure class="informalfigure">...

但是当我检查 TinyMCE 创建的 iframe 时,我看到了这个

<body id="tinymce" class="mce-content-body" onload="window.parent.tinymce.get('content').fire('load');" contenteditable="true" style="">             
<section class="card">
<figure class="informalfigure">

最佳答案

这是由于通过 Tinymce 插件创建 iframe 而发生的。

也许您可以将类和数据属性分配给 <body>在 iframe 中使用 Javascript/JQuery。

将这些更改应用到 Tinymce 的“oninit”回调中

function myCustomOnInit() {
$('iframe').contents().find('body')
.addClass("myprod-class");
.attr({
data-product:"myprod",
data-template:"spread-template"
});
}

tinyMCE.init({
...
oninit : myCustomOnInit
});

注意: oninit 回调指定当所有编辑器实例完成初始化时要执行的函数。这很像 HTML 页面的 onload 事件。

关于javascript - Tinymce更改完整的html文档,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22544863/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com