使用 TinyMCE 进行实时预览(TinyMCE 的价值)
Really Live Preview with TinyMCE (value of TinyMCE)
我正在使用一个简短的 Jquery 脚本来实时预览一些输入字段。现在使用 TinyMCE,我无法获取 tinyMCE 的值以将其插入 div。我找到了另一个线程 Get value of tinymce textarea with jquery selector,但我真的不知道如何在我的代码中使用这个技巧。我是 jQuery 的初学者,非常感谢所有帮助。
$(document).ready(function() {
updatePreview();
$('#live-preview-form input, #live-preview-form textarea').bind('blur keyup',updatePreview);
});
function updatePreview(){
var tinymce = $('#lp-message');
tinymce.html($('#message').val());
}
抱歉,您的代码中有很多错误。 :/
这是您在 javascript 部分下唯一需要的代码。
tinymce.init({
selector: "textarea",
setup : function(ed) {
ed.on("keyup", function(){
$('#lp-message').html(tinymce.activeEditor.getContent());
});
}
});
这是您的 html 代码:
<div id="live-preview-form">
<textarea id="message">Easy! You should check out MoxifvdfvdfvfdveManager!</textarea></div>
<div id="lp-message"></div>
如您所见,您必须使用 tinymce API 从编辑器中获取内容。 "keyup" 事件应该用在编辑器上而不是 "textarea".
希望对您有所帮助。 :)
我正在使用一个简短的 Jquery 脚本来实时预览一些输入字段。现在使用 TinyMCE,我无法获取 tinyMCE 的值以将其插入 div。我找到了另一个线程 Get value of tinymce textarea with jquery selector,但我真的不知道如何在我的代码中使用这个技巧。我是 jQuery 的初学者,非常感谢所有帮助。
$(document).ready(function() {
updatePreview();
$('#live-preview-form input, #live-preview-form textarea').bind('blur keyup',updatePreview);
});
function updatePreview(){
var tinymce = $('#lp-message');
tinymce.html($('#message').val());
}
抱歉,您的代码中有很多错误。 :/
这是您在 javascript 部分下唯一需要的代码。
tinymce.init({
selector: "textarea",
setup : function(ed) {
ed.on("keyup", function(){
$('#lp-message').html(tinymce.activeEditor.getContent());
});
}
});
这是您的 html 代码:
<div id="live-preview-form">
<textarea id="message">Easy! You should check out MoxifvdfvdfvfdveManager!</textarea></div>
<div id="lp-message"></div>
如您所见,您必须使用 tinymce API 从编辑器中获取内容。 "keyup" 事件应该用在编辑器上而不是 "textarea".
希望对您有所帮助。 :)