Javascript TinyMCE-自定义链接按钮；添加链接“；很好，但可以'；我找不到“的任何文件”；编辑链接“；和访问链接属性

我在TinyMCE中添加了一个自定义按钮，它将显示一个定制链接选择器。当用户选择一些文本并单击按钮时，对话框出现，当他们选择了我正在使用的url时，

execCommand（'insertHTML'，false，“；
execCommand（'insertHTML'，false，link）；//创建新链接
});
}
否则{
///这是缺失的一点！
};
}

实现这一点有两种方法：

按下按钮时，检查选择父节点。如果节点是链接，那么可以从HTMLA元素获取链接信息。要填充对话，您将知道该做什么

另一个选项是在右键单击上添加上下文菜单，它将提供必要的功能

这里是用于此的插件代码（请记住，您必须将“customcontextmenu”添加到tinymce的插件设置中）

---

谢谢塔里亚马！这是一个非常全面的答案！那么，获取光标所在位置的“a”元素的代码是什么？我在你的代码中看不到它？我把它插入了我的帖子，看看上面我发布的代码中的“onclick”——我想我看到了混淆的地方——你的“event.target”是右键单击事件，因此目标是光标所在的位置。我的是按钮事件，因此，按钮目标HTML对象！所以我想我需要知道如何获取光标所在的目标？您可以使用editor.selection.getNode（）来实现这一点，这将获取父节点的选择，请记住，如果您选择了文本的一部分，则会产生不同的结果，因为可能选择了多个html元素Hanks Thariama-但是当没有“选择”时（即光标在链接的中间）选择。GETNODE（）只给我链接的HREF！有类似（伪代码）编辑器的东西吗？

setup: function (ed) {
    ed.addButton("link", {
        title: "Link",
        onclick: function (evt) {
            Intranet.TextEditor._loadUrlDialog(jQueryTextAreaObject, evt);
        }
    });
}

_loadUrlDialog: function (jQueryTextAreaObject, clickEvent) {

    var mce = $(jQueryTextAreaObject).tinymce();

    var isSelected = mce.selection.getContent().length != 0 ? true : false;

    if (isSelected) {
        Intranet.UrlDialog.Fn.LoadDialog("", true, "", function (url, target, title) {

            var theTarget = target == false ? "_self" : "_blank";

            var link = "<a href=\"" + url + "\" target=\"" + theTarget + "\" title=\"" + title + "\">" + mce.selection.getContent() + "</a>";

            mce.execCommand('insertHTML', false, link); // creates new link

        });
    }
    else {
        /// THIS IS THE MISSING BIT!
    };
}

/**
 * editor_plugin_src.js
 *
 * Plugin for contextmenus.
 */

(function() {
    var Event = tinymce.dom.Event, each = tinymce.each, DOM = tinymce.DOM;

    tinymce.PluginManager.requireLangPack('customcontextmenu');

    /**
     * This plugin a context menu to TinyMCE editor instances.
     *
     * @class tinymce.plugins.customcontextmenu
     */
    tinymce.create('tinymce.plugins.customcontextmenu', {
        /**
         * Initializes the plugin, this will be executed after the plugin has been created.
         * This call is done before the editor instance has finished it's initialization so use the onInit event
         * of the editor instance to intercept that event.
         *
         * @method init
         * @param {tinymce.Editor} ed Editor instance that the plugin is initialized in.
         * @param {string} url Absolute URL to where the plugin is located.
         */
        init : function(ed) {
            var t = this, lastRng;

            t.editor = ed;

            // Registiere commands
            ed.addCommand('edit_inline_element', function() {
                //edit_inline_element(ed, ed.right_clicked_node);  //ed.right_clicked_node is the actually clicked node
                //call or do whatever you need here
            });

            // delete link
            ed.addCommand('delete_inline_element', function() {
                $(ed.right_clicked_node).replaceWith($(ed.right_clicked_node).html());
            });

                    // assign the right clicked node (it is the evt.target)
        ed.onClick.add(function(ed, evt) {
            if (evt.button == 2) ed.right_clicked_node = evt.target;
        });

            /**
             * This event gets fired when the context menu is shown.
             *
             * @event onContextMenu
             * @param {tinymce.plugins.ContextMenu} sender Plugin instance sending the event.
             * @param {tinymce.ui.DropMenu} menu Drop down menu to fill with more items if needed.
             */
            t.onContextMenu = new tinymce.util.Dispatcher(this);

            ed.onContextMenu.add(function(ed, e) {

                if (!e.ctrlKey) {

                    // Restore the last selection since it was removed
                    if (lastRng)
                        ed.selection.setRng(lastRng);

                    var menu = t._getMenu(ed);

                    if ((typeof menu).toLowerCase() == 'object')
                    {
                        menu.showMenu(e.clientX, e.clientY);

                        Event.add(ed.getDoc(), 'click', function(e) {
                            hide(ed, e);
                        });
                        Event.cancel(e);
                    }
                    // sonst Standardmenu anzeigen
                }

            });

            ed.onRemove.add(function() {
                if (t._menu)
                    t._menu.removeAll();
            });

            function hide(ed, e) {
                lastRng = null;

                // Since the contextmenu event moves
                // the selection we need to store it away
                if (e && e.button == 2) {
                    lastRng = ed.selection.getRng();
                    return;
                }

                if (t._menu) {
                    t._menu.removeAll();
                    t._menu.destroy();
                    Event.remove(ed.getDoc(), 'click', hide);
                }
            };

            ed.onMouseDown.add(hide);
            ed.onKeyDown.add(hide);
        },

        _getMenu: function(ed){
            var t = this, m = t._menu, se = ed.selection, col = se.isCollapsed(), el = se.getNode() || ed.getBody(), am, p1, p2;
            if (m) {
                m.removeAll();
                m.destroy();
            }

            p1 = DOM.getPos(ed.getContentAreaContainer());
            p2 = DOM.getPos(ed.getContainer());

            m = ed.controlManager.createDropMenu('contextmenu', {
                offset_x : p1.x + ed.getParam('contextmenu_offset_x', 0),
                offset_y : p1.y + ed.getParam('contextmenu_offset_y', 0),
                constrain : 1
            });

            t._menu = m;

                    if ((typeof ed.right_clicked_node) !== "undefined" && ed.right_clicked_node.nodeName.toLowerCase() == 'a' )
                    {
                        m.add({
                            title: $(ed.right_clicked_node).attr('title'),
                        });

                        m.addSeparator();

                        m.add({
                            title: 'Edit link',
                            icon: 'edit_inline_element',
                            cmd: 'edit_link'
                        });

                        m.add({
                            title: 'Delete link',
                            icon: 'delete_inline_element',
                            cmd: 'delete_link'
                        });

                        t.onContextMenu.dispatch(t, m, el, col);

                        return m;
                    }
                    else {
                        // kein Menu anzeigen
                        return 0;
                    }
        }
    });

    // Register plugin
    tinymce.PluginManager.add('customcontextmenu', tinymce.plugins.customcontextmenu);
})();