在匿名函数中显示函数输出

Question

我正在尝试在我的 javascript 代码中输出 SELECTED TEXT。我创建了一个函数，它将获取选定的文本，我只想在输出提交按钮时输出它。

这里是获取所选 HTML 或 TEXT 的 javascript。

function getSelectionHtml() {
    var html = "";
    if (typeof window.getSelection != "undefined") {
        var sel = window.getSelection();
        if (sel.rangeCount) {
            var container = document.createElement("div");
            for (var i = 0, len = sel.rangeCount; i < len; ++i) {
                container.appendChild(sel.getRangeAt(i).cloneContents());
            }
            html = container.innerHTML;
        }
    } else if (typeof document.selection != "undefined") {
        if (document.selection.type == "Text") {
            html = document.selection.createRange().htmlText;
        }
    }
   document.write(html);

}

这是我输出其他内容的代码以及上面的函数（但它不会只显示出来）

(function() 
{
    tinymce.PluginManager.add('my_mce_button', function( editor, url ) 
    {
        editor.addButton( 'my_mce_button', 
        {
            icon: false,
            text: 'Tooltip',
            onclick: function() 
            {
                editor.windowManager.open( 
                {
                    title: 'Tooltip Option',
                    body: 
                    [
                        {
                            type: 'textbox',
                            name: 'textboxtooltipName',
                            label: 'Tooltip Text',
                            value: ''
                        },
                        {
                            type: 'listbox',
                            name: 'listboxClassName',
                            label: 'Class',
                            'values': 
                            [
                                {text: 'Top Tooltip', value: 'top_tooltip'},
                                {text: 'Left Tooltip', value: 'left_tooltip'},
                                {text: 'Right Tooltip', value: 'right_tooltip'},
                                {text: 'Bottom Tooltip', value: 'bottom_tooltip'}
                            ]
                        }
                    ],
                    onsubmit: function( e ) 
                    {
                        editor.insertContent( '[tooltip class="' + e.data.listboxClassName + '" title="' + e.data.textboxtooltipName + '"]  html  [/tooltip]');
                    }
                });
            }
        });
    });
})();

现在这一行负责显示 SELECTED TEXT + 其他属性。基本上，我创建了一个 HTML 变量来捕获选定的文本，但它没有显示在我的代码中。查看代码：

onsubmit: function( e ) 
{
    editor.insertContent( '[tooltip class="' + e.data.listboxClassName + '" title="' + e.data.textboxtooltipName + '"]  html  [/tooltip]'); 
}

知道发生了什么吗？如何正确显示getSelectionHtml函数的输出到匿名函数的输出？

Answer 1

您的 getSelectionHtml() 函数获取页面上选择的文本，但我认为您希望在 tinymce 编辑器中选择文本。

试试：

editor.insertContent(
    '[tooltip class="' + e.data.listboxClassName
    + '" title="' + e.data.textboxtooltipName + '"]'
    + editor.selection.getContent()
    + '[/tooltip]');

Answer 2

试试

function getSelectionHtml() {
  html = ""; // removed var so that it can be accessed globally.
  if (typeof window.getSelection != "undefined") {
    var sel = window.getSelection();
    if (sel.rangeCount) {
        var container = document.createElement("div");
        for (var i = 0, len = sel.rangeCount; i < len; ++i) {
            container.appendChild(sel.getRangeAt(i).cloneContents());
        }
        html = container.innerHTML;
    }
  } else if (typeof document.selection != "undefined") {
    if (document.selection.type == "Text") {
        html = document.selection.createRange().htmlText;
    }
  }
 //document.write(html); this will rewrite the document - don't do this!
}

在匿名函数中：

onsubmit: function( e ) 
{
   getSelectionHtml(); // get selected the text
   if(html) // check whether text is selected
       editor.insertContent( '[tooltip class="' + e.data.listboxClassName + '" title="' + e.data.textboxtooltipName + '"]'+  html+'  [/tooltip]'); // html now reffers to the global variable
}