多个tinymce textarea
Posted
技术标签:
【中文标题】多个tinymce textarea【英文标题】:multiple tinymce textareas 【发布时间】:2013-03-08 17:12:56 【问题描述】:我将 tinymce 用于动态生成至少 5 个文本的网页。
不幸的是,我使用的配置仅适用于第一个textarea
。
tinyMCE.init(
height : "300",
mode : "exact",
elements : "content",
theme : "simple",
editor_selector : "mceEditor",
...
<textarea class="mceEditor" name="content" rows="15" cols="40">content</textarea>
在all textarea
's 中启用 tinymce 编辑的配置是什么。
【问题讨论】:
我们如何启用 tinymce 排除类中的特定项目?我可以处理身份证。我发布了另一个问题——***.com/questions/55181418/… 【参考方案1】:如果您使用“精确”模式,则需要指定要转换为编辑器的元素的 ID。
function initMCEexact(e)
tinyMCE.init(
mode : "exact",
elements : e,
...
);
// add textarea element with id="content" to document
initMCEexact("content");
// add textarea element with id="content2" to document
initMCEexact("content2");
// add textarea element with id="content3" to document
initMCEexact("content3");
或者,您可以使用“textarea”模式,它将编辑器不加选择地应用于所有文本区域。
function initMCEall()
tinyMCE.init(
mode : "textareas",
...
);
// add all textarea elements to document
initMCEall();
请记住,如果您要动态创建 textareas,则需要在创建元素后调用 tinyMCE.init(),因为它们需要存在,tinyMCE 才能转换它们.
Here is the documentation on modes。
【讨论】:
【参考方案2】:对于 TinyMCE 4.0,您必须使用选择器或为每个所需配置定义 tinymce.init 对象/方法 (https://www.tinymce.com/docs/get-started/multiple-editors/)。
例如,这是一个有 3 个编辑器的页面:
<!DOCTYPE html>
<html>
<head>
<script src="http://cdn.tinymce.com/4/tinymce.min.js"></script>
<script type="text/javascript">
tinymce.init(
selector: '#myeditable-h1',
toolbar: 'undo redo'
);
tinymce.init(
selector: '.standard-editor'
);
</script>
</head>
<body>
<form method="post">
<h1 id="myeditable-h1">This Title Can Be Edited If You Click Here</h1>
</form>
<form method="post">
<div id="myeditable-div1" class="standard-editor">
<p>This section1 of content can be edited...</p>
</div>
<div id="myeditable-div2" class="standard-editor">
<p>This section2 of content can be edited...</p>
</div>
</form>
</body>
</html>
【讨论】:
【参考方案3】:您应该在配置中使用不同的模式。例如模式:“specific_textareas”适用于具有在 editor_selector 参数中指定的给定类的所有文本区域。
为了使用 mceEditor 类在所有文本区域上工作,您可以使用这个:
tinyMCE.init(
mode : "specific_textareas",
editor_selector : "mceEditor",
.....
【讨论】:
这根本不起作用。它转换这个选择器和所有其他文本,除了那些由“editor_deselector”指定的类。所以换句话说,“editor_selector”什么都不做,只有“editor_deselector”有效。如果您省略“editor_deselector”,它只会选择所有文本区域。【参考方案4】:在选择器中使用类 我有两个或更多的文本区域,我想初始化那些 int 很小的所以
<textarea class="mytextarea"></textarea>
<textarea class="mytextarea"></textarea>
.
.
.
在初始化 tinyint 代码中:
tinymce.init(
selector: 'textarea.mytextarea',
plugins : 'advlist autolink link lists preview table code pagebreak',
.
.
.
【讨论】:
如何获取特定元素的值?【参考方案5】:根据tinymce.com/wiki.php/Configuration:selector,选择器是选择应该可编辑的元素的推荐方式。
对于所有 textarea 元素,根据要求:
selector: "textarea",
或者更优雅,只有那些带有特定 CSS 标签的元素:
selector: "textarea.editme",
<textarea class="editme">
【讨论】:
以上是关于多个tinymce textarea的主要内容,如果未能解决你的问题,请参考以下文章
我用的是tinymce,是不是可以只申请一个textarea