TinyMCE js和WordPress PHP之间的桥梁?

时间:2012-11-20 作者:Alan

我正在更新我的wordpress插件,以使用自定义的TinyMCE按钮。在TinyMCE按钮javascript中,我想与wordpress数据交互——即在插件设置页面中设置自定义post选项,然后在TinyMCE js脚本中访问这些值。

我可以从TinyMCE按钮处理程序代码(即javascript)中调用php插件函数吗?

有我能用的桥吗?

澄清如下:

作为插件安装过程的一部分,系统会指示用户转到插件设置页面,并输入一些数据。此数据通常使用Wordpress插件API挂钩存储和读取:get_optionset_option 这是我原始插件的一部分,可以正常工作。

我现在添加了一个TinyMCE按钮,当我单击它时,会显示一个HTML页面,其中包含一个HTMLtextarea. 这部分也很好。

然而,我想填补textarea 通过get_option Wordpress插件调用,但我不知道如何访问API。

另一个可接受的解决方案是将数据传递到TinyMCE脚本中,并以这种方式进行输入。

或者让TinyMCE按钮脚本调用PHP插件脚本中的一个方法,该方法读取数据并将其返回到TinyMCE按钮脚本中。

2 个回复
SO网友:Mario Peshev

我有集成的按钮来支持WordPress功能,如果this material 将添加一些上下文和代码示例到您的用例中。

SO网友:Oleg Butuzov

mce按钮代码示例

(function() {
var each = tinymce.each;
tinymce.PluginManager.requireLangPack(\'grid\');
tinymce.create(\'tinymce.plugins.FoundationGridPlugin\', {
    init : function(ed, url) {
        var t = this; t.editor = ed;
        imageUrl = url + \'/../images/grid.png\';
    },

    createControl : function(n, cm) {

        var t = this, c, ed = t.editor;

        if (n == \'grid\') {
            c = cm.createButton(n, {
                title : \'grid.title\', 
                scope : t, 
                image:imageUrl,
                onclick : function() {
                    ed.execCommand("mceShowGridContainer", false, false);
                }

            });
            return c;
        }
    },

    execCommand: function(cmd, ui, type) {
        var ed = tinyMCE.activeEditor;
        var url = this.url;
        switch (cmd) {
            case "mceShowGridContainer":
                jQuery.post(ajaxurl, {action:\'grid_action_ajax\'}, function(html){
                     // some code here
                });
            break;
        }   
    },

    getInfo : function() {
        return {
            longname : \'Foundation Grid Generator\',
            author   : \'Oleg Butuzov;\',
            authorurl: \'http://made.com.ua\',
            infourl  : \'http://made.com.ua\',
            version  : \'2.0\'
        };
    }
});

tinymce.PluginManager.add(\'grid\', tinymce.plugins.FoundationGridPlugin);
})();
这是您实际需要的代码。。。

onclick : function() {
    ed.execCommand("mceShowGridContainer", false, false);
}
其中运行

case "mceShowGridContainer":
       jQuery.post(ajaxurl, {action:\'wpse73257_grid_action_ajax\'}, function(html){
             // some code here
       });
break;
现在,您只需添加将与脚本交互的ajax\\u操作

 add_action(\'wp_ajax_wpse73257_grid_action_ajax\', \'wpse73257_grid_action_ajax\');
 function wpse73257_grid_action_ajax(){
   //do something and show something
 exit;
}

结束

相关推荐

将div从unctions.php回显到header.php

在标题部分内。php我有一个div结构<div id=\"header\"> <div id=\"masthead\"> <div id=\"branding\"> 。。。我想在“branding”中添加一个div,我可以通过编辑标题轻松完成这一任务。直接使用php。我还认为我可以使用函数。php收件人:add_action(\'wp_head\', \'add_div\' ); 。。。然后在代码中回显。是否有任何方法可以定义代码应该