从编辑器外部添加html到WYSIWYG（jQuery，ClEditor）

Question

我试图从编辑器本身外部使用jQuery向WYSIWYG CLEditor添加一些html标记。

到目前为止，我有...

$('.add-image').click(
    function() 
    { 
     theurl = $(this).text(); 
     theimage = '<a href="' + theurl + '" class="lightbox"><img src="' + theurl + '" /></a>'; 
     // Now What? 
    } 
); 

但我手足无措，如何在以所见即所得添加字符串和它开始把我疯了！

Answer 1

这将覆盖：

$("#inputID").val(theimage); 
$("#inputID").cleditor()[0].updateFrame(); 

这将追加：

currentval = $("#inputID").val(); 
$("#inputID").val(theimage); 
$("#inputID").val(currentval + theimage); 

或者，也许试试这个：

$('#inputID').val('new text data').blur(); 

哪里inputID是您CLEditor输入的ID。

另外，这有一些解决这个讨论：

CLEditor dynamic adding text

Answer 2

只是做2名小编辑CCCasons解决方案，以按预期工作。

$('.add-image').click(
function() 
{ 
    theurl = $(this).text(); 
    theimage = '<a href="' + theurl + '" class="thelightbox" style="display: block"><img src="' + theurl + '" /></a><br/>'; 

    // Get the current value of the textarea otherwise it will be overwritten 
    currentval = $("textarea.wysiwyg").val(); 

    $("textarea.wysiwyg").val(currentval + theimage); 
    $("textarea.wysiwyg").cleditor()[0].updateFrame();     
} 
); 

1）在插入的链接的末尾添加了换行符。否则，当你在添加图像后尝试输入wysiwyg时，它会在链接内输入。

2）首先抓取textarea的当前值，以阻止它被图像覆盖。

再次，非常感谢CCCason！