tinymce 相关问题

TinyMCE是一个基于Web的JavaScript HTML WYSIWYG编辑器控件,可用作开源和基于云的API。使用此标记可以了解有关TinyMCE的使用及其与CMS和其他基于Web的应用程序的集成的问题。

如何设置tinymce文本区域的高度?

我正在使用以下内容: <p>我正在使用以下内容:</p> <pre><code> <textarea data-ui-tinymce="tinymceOptions" data-ng-disabled="modal.action=='delete'" data-ng-model="modal.formData.text" id="inputText" rows="20" required></textarea> </code></pre> <p>tinymce出现时高度只有几厘米。第一次出现时如何更改默认高度?</p> <p>这是我正在使用的选项列表:</p> <pre><code>selector: "textarea", plugins: [ "advlist autolink autosave link image lists charmap print preview hr anchor pagebreak spellchecker", "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking", "table contextmenu template textcolor paste fullpage textcolor" ], toolbar1: "bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | styleselect fontselect fontsizeselect", toolbar2: "cut copy paste | searchreplace | bullist numlist | outdent indent blockquote | undo redo | code | inserttime preview | forecolor backcolor", toolbar3: "table | hr removeformat | subscript superscript | charmap | print fullscreen | spellchecker | visualchars visualblocks nonbreaking template pagebreak restoredraft", menubar: false, toolbar_items_size: 'small', templates: [ {title: 'Test template 1', content: 'Test 1'}, {title: 'Test template 2', content: 'Test 2'} </code></pre> <p>]</p> </question> <answer tick="false" vote="25"> <p>来自javascript</p> <pre><code>tinymce.init({ selector: 'textarea', height: 200 }); </code></pre> <p>或来自 html</p> <pre><code><textarea style="height: 200px;"> </code></pre> </answer> <answer tick="true" vote="6"> <p>你应该在 CSS 中设置容器对象的高度:</p> <pre><code>#inputText { height : 10000000px; } </code></pre> </answer> <answer tick="false" vote="2"> <p>对于 tinyMCE 版本 <strong>before</strong> 4.X 那么这段代码是有效的</p> <pre><code>tinyMCE.init({ ..., setup: function(editor) { editor.onInit.add(function() { var width = editor.getWin().clientWidth; var height = 50; editor.theme.resizeTo(width, height); }); } }); </code></pre> <p>对于 tinyMCE 版本 4.X 和 <strong>之后</strong> 那么这段代码是有效的</p> <pre><code>tinyMCE.init({ setup: function (ed) { ed.on('init', function(args) { var id = ed.id; var height = 25; document.getElementById(id + '_ifr').style.height = height + 'px'; }); } }); </code></pre> </answer> <answer tick="false" vote="1"> <p>TinyMCE的全局高度设置,编辑Django项目的settings.py:</p> <pre><code>TINYMCE_DEFAULT_CONFIG = {'height': 120} </code></pre> <p>对于每个小部件设置,在表单类中使用<pre><code>mce_attrs</code></pre>:</p> <pre><code>input = forms.CharField(widget=TinyMCE(mce_attrs={'height': 120})) </code></pre> <p>使用 django-tinymce 2.7.0. 测试</p> <p><strong>引擎盖下:</strong> 您可以在文本区域生成的 HTML 的 data-mce-conf 属性中看到类似<pre><code>&quot;height&quot;: 120,</code></pre> 的字符串。否则,会出问题。</p> </answer> <answer tick="false" vote="0"> <p>对我有用(见<strong>setTimeout</strong>部分)</p> <p></p><div data-hide="false" data-lang="js"> <div> <pre><code>$(function () { window.init_tinymce = function (id, custom_config) { var textarea = $('#' + id); // Default TinyMCE configuration var basic_config = { mode: 'none', plugins: "link", menu: 'none', toolbar: 'bold | formatselect | link' }; tinymce.init($.extend(basic_config, custom_config)); ... setTimeout(function(){ //wait for tinymce to load console.log('timeout'); $(tinymce.editors[0].iframeElement).contents().find('body') .css('min-height', $(tinymce.editors[0].contentAreaContainer).height() * .9); }, 1000); }; });</code></pre> </div> </div> <p></p> </answer> <answer tick="false" vote="0"> <p>将此 css 添加到您的自定义样式表,否则它将降低所有现有编辑器的高度。 </p> <pre><code>.mce-edit-area iframe { max-height: 200px; } </code></pre> </answer> <answer tick="false" vote="0"> <p>对于版本 6,以下代码应该可以工作</p> <pre><code>const wishedHeight = '100px' // get `editor` from context of callbacks like `init`, `setup`, `loaded`, etc editor.editorContainer.style.height = wishedHeight; </code></pre> </answer> </body></html>

回答 0 投票 0

tiny mce 提到插件在获取调用中访问服务器 url 时遇到问题

我正在通过云 API 使用 tiny mce 6,需要做一个基本的提及插件实现来带来用户列表,但是当我调用服务器上的其中一个路由来获取用户时,网络...

回答 0 投票 0

setContent of an textarea with tinyMCE

我有一些文本区域,它们都带有 tinyMCE。 我想设置特定文本区域的内容,但找不到方法。 我试过这个: tinyMCE.get('标题').setContent(

回答 11 投票 0

如何在 tinyMCE 中用服务器的 url 替换 imgae 文件?

所以,我将富文本编辑器从 Quill 更改为 tinyMCE,我面临的问题是当我从本地计算机上传图像时,我在使用 tinymce.activeEditor 时将其作为文件获取。

回答 1 投票 0

如何从 tinymce 文档编辑器中删除警告消息

伙计们,我在我的 asp.net Web 应用程序中使用 CKEditor 和 tinymce 编辑器来创建新文档并将它们另存为 pdfs 它工作得很好,但我不断收到此警告消息 它...

回答 0 投票 0

使用 tinymce 编辑器获取故事书以使用 node_module 中的本地资产来创建组件的故事?

我正在编写一个 Angular 15 应用程序,利用 formly-package 为我生成表单。 Formly 提供了大多数字段以开箱即用地在其表单内部呈现,但不是具有丰富

回答 1 投票 0

TinyMCE file_picker_callback 试图发送 axios 请求但没有 cookie

我目前面临的问题是我发出了一个包含图像的 axios Post multipart/form-data 请求。这来自 TinyMCE 编辑器组件的 file_picker_callback。 我目前面临的问题是我发出了一个包含图像的 axios Post multipart/form-data 请求。这来自 TinyMCE 编辑器组件的 file_picker_callback。 <Editor onInit={(evt, editor) => (editorRef.current = editor)} initialValue={service?.description || ""} init={{ apiKey: tinyApiKey, height: 1000, menubar: false, plugins: ["image", "link"], toolbar: "h1 h2 h3 | image link | formatselect | " + "bold | alignleft aligncenter " + "alignright alignjustify | bullist numlist outdent indent | " + "removeformat | help", content_style: "body { font-family:Helvetica,Arial,sans-serif; font-size:14px }", images_upload_url: `${process.env.REACT_APP_BACKEND_URL}/api/upload`, file_picker_callback: (callback, value, meta) => { const input = document.createElement("input"); input.setAttribute("type", "file"); input.setAttribute("name", "image"); input.setAttribute("accept", "image/*"); input.onchange = () => { const file = input.files[0]; const formData = new FormData(); formData.append("file", file); axios .post(`${process.env.REACT_APP_BACKEND_URL}/api/upload`, formData) .then((response) => { const editor = window.tinymce.activeEditor; const img = `<figure className="img-container"><img src="${response.data.location}" alt="descriptive"/></figure>`; editor.insertContent(img); callback(response.data.location); }) .catch((error) => { console.log(error); }); }; input.click(); }, }} /> 后端路由包含2个中间件,第一个是authMiddleware,第二个是multer,我的请求无法通过authMiddleware。 路由器: const protect = require("../middleware/authMiddleware"); const { upload } = require("../utils/fileUpload"); router.post("/", protect, upload.single("file"), uploadImage); authMiddleware.js : const jwt = require("jsonwebtoken"); const User = require("../models/userModel"); const asyncHandler = require("express-async-handler"); const protect = asyncHandler(async (req, res, next) => { try { const token = req.cookies.token; // Valiadate if (!token) { res.status(401); throw new Error("Not authorized, please log in"); } // Verify const verified = jwt.verify(token, process.env.JWT_SECRET); const user = await User.findById(verified.id).select("-password"); if (!user) { res.status(404); throw new Error("User not found"); } req.user = user; next(); } catch (error) { res.status(401); throw new Error("Not authorized, please log in"); } }); module.exports = protect; 上传控制器.js: const asyncHandler = require("express-async-handler"); const { fileSizeFormatter } = require("../utils/fileUpload"); const uploadImage = asyncHandler(async (req, res) => { fileData = { fileName: req.file.originalname, filePath: req.file.path, fileType: req.file.mimetype, fileSize: fileSizeFormatter(req.file.size, 2), }; res.status(201).json({ location: `${req.protocol}://${req.hostname}:5000/${req.file.path}`, }); }); module.exports = { uploadImage, }; 我检查了控制台,错误是 Not Authorized,please log in which is from authMiddleware,我还检查了请求没有发送任何 cookie。我也有: axios.defaults.withCredentials = true; 我检查了控制台,错误是 Not Authorized,please log in which is from authMiddleware,我还检查了请求没有发送任何 cookie。我也有: axios.defaults.withCredentials = true;

回答 0 投票 0

span 和 div 标签不替换 TinyMCE 中选择的外部 p 标签

我正在使用 TinyMCE 编辑器,我正在尝试编辑 style_formats。我添加了自己的标题: //... { 标题:'标题',项目:[ { title: 'Titre principal', block: 'div', classes: ['...

回答 0 投票 0

TinyMCE:span 和 div 标签不替换选择的外部 p 标签

我正在使用 TinyMCE 编辑器,我正在尝试编辑 style_formats。我添加了自己的标题: //... { 标题:'标题',项目:[ { title: 'Titre principal', block: 'div', classes: [...

回答 0 投票 0

截屏后如何上传粘贴到 TinyMCE 的图像?

有谁知道如何上传在截屏后粘贴到 TinyMCE 中的图像? 请有人能帮我举个 javascript 的例子吗? 我尝试使用 multer,但没有成功,因为 M...

回答 1 投票 0

TinyMCE:div 中的 p 标签具有自定义样式格式

我正在使用 TinyMCE 编辑器,我正在尝试编辑 style_formats。我添加了自己的标题: //... { 标题:'标题',项目:[ { title: 'Titre principal', block: 'div', classes: [...

回答 0 投票 0

如何将 React 中的 tinymce 文本分成多个部分,并仅更改这些部分 onEditorChange 以将它们发送到后端?

我有一个 React 应用程序,它有一个 TinyMCE 实例,在更改编辑器上的特定部分后,我想将它们保存在后端,只有那些已更改的部分。有没有可能实现一些...

回答 1 投票 0

TinyMCE 源代码插件删除锚标签之间的文本

我需要用文本制作一个锚标记链接...所以当我编辑源代码并输入类似

回答 2 投票 0

使用微型编辑器上传图片时出现问题

在这里输入图片描述我上传图片时遇到问题,但没有出现任何东西, 我使用 laravel 和 blade 这是解释我的问题的屏幕: 我什么都不尝试

回答 0 投票 0

在上传之前从图像中获取宽度和高度 tinymce

如何将调整后的图像高度和宽度放入图像上传处理程序中,以便以后缩小到指定尺寸 我查看了所有文档,但没有找到答案。

回答 0 投票 0

Change dockerized Django default app from git ignored .env

我需要修改站点包中 django.contrib 和 tinymce 中的默认平面应用程序。当 Docker 启动时,两者都在从 requirements.txt 安装的 gitignored env 目录中。怎么...

回答 0 投票 0

TinyMCE, Bootstrap Modal & URL Parameter: wp is not defined

使用 Bootstrap 5 和 WordPress 6.2 我正在构建一个 WordPress 插件。我有一个仪表板和一个所有内容页面。 Dashboard 页面列出了最近创建的内容;每个条目...

回答 1 投票 0

Silverstripe 4 CMS 的 TinyMCE 插件

我正在为 Tinymce 开发一个插件,以便在 Silverstripe 4 中使用。 这是一个脚注 - 用于创建带有连续数字的标签的插件。 脚注 - 文本存储在一个 div (.footnoteContain...

回答 0 投票 0

TinyMCE HTML 编辑器禁用图像插入源文本框

我正在使用带有插入图像功能的 TinyMCE HTML 编辑器。我正在处理的应用程序不允许使用来自外部 URL 的图像。所以他们应该只能使用上传选项...

回答 2 投票 0

TinyMCE 在只读模式下启用按钮

我有一个 TinyMCE 4.x 实例,其中文本应处于只读模式。但是我仍然有一些我想启用的按钮。例如,一个按钮可以为 ...

回答 6 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.