Question

我需要向jquery添加contextMenu jHtmlArea，以便将关键字添加到jHtmlArea，但我无法通过iframe标记为contextMenu触发器。

这里是代码

$(function () {

    $.contextMenu({
        selector: 'iframe body', 
        className: 'data-title',
        callback: function (key, options) {
            //inserts the keyword selected
            insertAtCaret($(this).attr('id'), '{' + key + '}');
        },
        items: {
            "TestPath": { name: "Test path", icon: "" },
           ...
        }
    });

    //adding an extra button to the jHtmlArea
    jHtmlArea.defaultOptions.toolbar.push([
        {
            // This is how to add a completely custom Toolbar Button
            css: "keywords",
            text: "Insert keywords",
            action: function (btn) {
                this.contextMenu(); //Error:this.contextMenu is not a function
            }
        }
    ]);

    //just for context...
    function insertAtCaret(areaId, text) {
       ...
    }

   //setting up `jHtmlArea` for input #editor

   $('#editor').htmlarea();

});

我尝试了许多方法来获取“iframe”身体＆＃39;单击自定义工具栏按钮时，元素没有成功。此外，我尝试将contextMenu创建移动到jHtml加载事件中，跳转问题是文档就绪后加载iframe。

可行的其他方法是简单地指定选择器＆＃39; iframe＆＃39;对于上下文菜单，当用户右键单击框架内时，菜单应弹出。

我需要一些指导方针或不同的方法。

Answer 1

我设法从工具栏按钮弹出contextMenu。我很确定有一种方法可以从iframe内部弹出但我无法找到它。在这里我的解决方案：

jHtmlArea.defaultOptions.toolbar.push([
{
    // This is how to add a completely custom Toolbar Button
    css: "keywords",
    text: "Insert keywords",
    action: function (btn) {

        var jhtml = this;
        $(function () {

            $.contextMenu({
                selector: '.keywords',
                className: 'data-title',
                callback: function (key, options) {
                    jhtml.pasteHTML("{" +key+ "}");
                },
                items: {
                    "WorkerUnit": { name: "Worker Unit", icon: "" },
                    ...
                }
            });

            $('.keywords').contextMenu(); //call it
        });
    }
}
]);

如何将上下文菜单添加到jHtmlArea

1 个答案: