从编辑器外部将 html 添加到所见即所得（jQuery、ClEditor）答案

【问题标题】：Add html to WYSIWYG from outside the editor (jQuery, ClEditor)从编辑器外部将 html 添加到所见即所得（jQuery、ClEditor）
【发布时间】：2012-02-27 02:23:21
【问题描述】：

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

到目前为止，我...

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

但是我不知道如何将字符串添加到 WYSIWYG 中，它开始让我发疯！

【问题讨论】：

标签： javascript jquery wysiwyg jwysiwyg cleditor

【解决方案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

【讨论】：

【解决方案2】：

刚刚对 CCCasons 解决方案进行了 2 次小修改，以使其按预期工作。

$('.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) 在插入链接的末尾添加了换行符。否则，当您在链接中添加图像后尝试输入所见即所得时。

2) 首先获取 textarea 的当前值以阻止它被图像覆盖。

再次感谢 CCCason！

【讨论】：

我更新了我的答案，我以为你想覆盖。对于那个很抱歉。我为两者都输入了代码，以便下一个遇到此问题的人可以选择。 =D