我决定使用TinyMCE'增强'表单中的textarea ...但是，这样做会中断原始元素的样式和jQuery功能，因为TinyMCE将该元素包装在{{1和一些iframe。我希望能够做的是获得TinyMCE功能（保留文本格式等），但不会丢失我与原始div相关联的样式和功能。我查看了TinyMCE文档，但似乎无法找到任何相关信息。有没有人对如何做到这一点有任何想法？
我的表单的特色是textarea，如此：
textarea但添加TinyMCE会破坏<head>
<script>tinymce.init( { selector: 'textarea' } );</script>
</head>
<div class="form-element">
<div class="label-container">
<label for="body">Post</label><span class="warning">Please fill out this field</span>
</div>
<textarea id="body" class="input-field" name="body"></textarea>
</div>
/ label关系。
此外，jQuery功能已被破坏，例如此验证脚本：
textarea因为$("form").submit(function(e){
tinyMCE.triggerSave();
var inputFields = $(".input-field");
var proceed = true;
for(var i = 0; i < inputFields.length; i++){
if($(inputFields[i]).val() == ""){
$(inputFields[i]).css("border", "solid 3px #E86F3A");
$(inputFields[i]).prev().find(".warning").show();
var proceed = false;
e.preventDefault();
}
else{
$(inputFields[i]).css("border", "none");
$(inputFields[i]).prev().find(".warning").hide();
};
};
//OTHER STUFF...
});
变量中不再提取textarea.input-field。
因此，简而言之，我正在寻找TinyMCE包装器来“继承”它所附加元素的样式和功能。可能的？
答案 0 :(得分：0)
正如您在<textarea>上调用TinyMCE时所猜测的那样，原始<textarea>上的<iframe>已不再显示在页面上，并被<div>和{{1}系列所取代} elements。
如果您希望保持基础<textarea>同步，可以使用tinymce.triggerSave()方法。这将使用适当的TinyMCE实例的当前值更新所有基础<textarea>元素。
当有人试图保存/提交内容时，您可以执行此操作，或者您可以尝试在某些编辑器事件发生时执行此操作（https://www.tinymce.com/docs/advanced/events/#editorevents）。除非您需要<textarea>内容的实时准确性，否则在执行jQuery验证之前更容易调用triggerSave()方法。
注意： 在<textarea>上设置边框不会对TinyMCE产生任何影响，因为您不再看到基础<textarea>。您当然可以尝试将CSS添加到编辑器的HTML中。 TinyMCE 4.4的外边框附有以下类：
class="mce-tinymce mce-container mce-panel"
...但请注意，这些类可能会随着时间的推移而发生变化，因此如果您升级TinyMCE，请检查以确保您的CSS在升级之前仍然有效。