javascript 在 wysiHTML5 编辑器中以编程方式插入 HTML

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/10739237/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 10:52:27  来源:igfitidea点击:

Insert HTML programmatically in wysiHTML5 editor

javascriptwysiwygwysihtml5

提问by daemon

I found javascript wysiwyg editor wysiHTML5.

我找到了 javascript wysiwyg编辑器wysiHTML5

I'm trying to add element <a href=...>to the editor or just turn on bold programmatically.

我正在尝试向<a href=...>编辑器添加元素,或者只是以编程方式打开粗体。

My code is:

我的代码是:

var editor = new wysihtml5.Editor("textarea", {
    toolbar:      "toolbar",
    stylesheets:  "css/wysihtml5.css",
    parserRules:  wysihtml5ParserRules
});

editor.observe("load", function() {
    editor.composer.commands.exec("bold");
});

Am I doing something wrong?

难道我做错了什么?

回答by mateusmaso

Actually no, but you have to be sure that your textarea (iframe) is focused. Try to use oninstead of observe. Here is a sample code that worked for me with insertHTML.

实际上没有,但你必须确保你的 textarea (iframe) 是有重点的。尝试使用on而不是observe. 这是一个使用 insertHTML 对我有用的示例代码。

editor.on("load", function() {
  editor.focus();
  editor.composer.commands.exec("insertHTML","<a href=....>text</a>");
});

回答by Matyas

mateusmaso's solution gave me the following error:

mateusmaso 的解决方案给了我以下错误:

NS_ERROR_FAILURE: Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMHTMLDocument.execCommand]
[Break On This Error]   

Object.defineProperty(object, property, config);

So I've investigated some more and found the following solution, which (IMO) seems more ok:

因此,我进行了更多调查并找到了以下解决方案,(IMO)似乎更合适:


var value = 'whatever you want to set';
// The jQuery reference to the textarea
var $ta = $('textarea#your-selector');
// The reference to the wysihtml5 editor - everything is contained within it 
var w5ref = $ta.data('wysihtml5');
// Check if you have it
if(w5ref){
   // if yes it's really an enhanced / wysihtml5ed textarea 
   // and use its setter
   w5ref.editor.setValue(value);
} else {
   // otherwise just simply populate the textarea as you normally would
   $ta.html(value);
}

Source

来源

回答by Rodrigo R Novaes

assuming you have instantiated the editor previously using $('#textarea-id').wysihtml5()

假设您之前使用过实例化了编辑器 $('#textarea-id').wysihtml5()

$('#textarea-id').data("wysihtml5").editor.setValue('new content');

font

字体