将 HTML 内容导入 TinyMCE 编辑器



我正在使用TinyMCE编辑器。虽然我在网站上查看了Stackoverflow中的所有主题,但我无法使用"setContent"显示我的HTML内容。我的内容以 HTML 形式包含在内,但它似乎是纯文本。

脚本代码如下:

<script type="text/javascript">
tinymce.init({
setup: function (editor) {
editor.on('init change', function () {
editor.setContent('{{ @$post->body }}');
editor.save();
});
},
height: 400,
branding: false,
selector: '#sy-editor',
element_format : 'html',
plugins: 'print preview paste importcss searchreplace autolink autosave save directionality code visualblocks visualchars fullscreen image link media template codesample table charmap pagebreak nonbreaking anchor toc insertdatetime advlist lists wordcount imagetools textpattern noneditable help charmap emoticons',
menubar: "",
toolbar: 'image media link | formatselect | bold italic underline | forecolor | alignleft aligncenter alignright | bullist numlist | table charmap emoticons | fullscreen',
save_enablewhendirty: true,
save_onsavecallback: function () {
var body = tinymce.activeEditor.getContent();
},
automatic_uploads: true,
image_title: true,
images_upload_url: '{{ route('news.image.upload') }}',
file_picker_types: 'image',
file_picker_callback: function (cb, value, meta) {
var input = document.createElement('input');
input.setAttribute('type', 'file');
input.setAttribute('accept', 'image/*');
input.onchange = function () {
var file = this.files[0];
var reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = function () {
var blobCache = tinymce.activeEditor.editorUpload.blobCache;
var base64 = reader.result.split(',')[1];
var blobInfo = blobCache.create(file.name, file, base64);
blobCache.add(blobInfo);
cb(blobInfo.blobUri(), {title: file.name});
};
};
input.click();
},
language_url : '{{ asset('scripts/tinymc-lang-tr_TR.js') }}',
language: 'tr_TR',
content_css: [
'{{ asset('styles/panel.css') }}'
],
});
</script>

输出如下:

如果你需要在 Larvel blade 中输入一些 HTML(你添加了一个 laravel 标签,所以我假设你在这里使用 laravel blade(,你可以这样做:

<textarea id="sy-editor">
{{ $post->body }}
</textarea>

你不需要在javascript中初始化内容

最新更新