插入HTML编程方式wysiHTML5编辑器(Insert HTML programmaticall

2019-07-29 13:04发布

我发现JavaScript的WYSIWYG编辑器wysiHTML5 。

我试图元素添加<a href=...>编辑器或只需打开程序大胆。

我的代码是:

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

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

难道我做错了什么?

Answer 1:

其实也没什么,但你必须确保你的textarea(IFRAME)是专注。 尝试使用on ,而不是observe 。 下面是与insertHTML为我工作的样本代码。

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


Answer 2:

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

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

Object.defineProperty(object, property, config);

所以,我调查了一些,发现如下解决方案,它(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);
}

资源



Answer 3:

假设你以前使用实例化的编辑器$('#textarea-id').wysihtml5()

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

字形



文章来源: Insert HTML programmatically in wysiHTML5 editor