Question

我正在开发一个Wordpress插件，需要在编辑器中添加一个按钮。单击该按钮，将打开一个包含一些表单域的对话框。用户可以填写数据，当他们“提交”时，它会在编辑器中创建一个短代码。

我能够成功地将按钮添加到编辑器中，并且我已经启动了AJAX调用来加载对话框。这是JS的一个片段，使这成为可能：

ed.windowManager.open(
    {
        file : ajaxurl + '?action=my_dialog_window',
        width : 480 + parseInt(ed.getLang('my_app.delta_width',0)),
        height : 300 + parseInt(ed.getLang('my_appdelta_height',0)),
        inline : 1
    },
    {
        plugin_url : url,
        some_custom_arg : 'custom arg'
    }
)

在我的模块中，我打电话给以下人员：

add_action('wp_ajax_my_dialog_window', 'my_dialog_window');

基本功能如下：

function my_dialog_window()
{
    // Queue JavaScript
    wp_enqueue_script("jquery");
    wp_enqueue_script("tiny_mce_popup",MY_WP_PLUGIN_URL."/js/tiny_mce_popup.js");
    wp_enqueue_script("my-dialog",MY_WP_PLUGIN_URL."/js/my-dialog.js");

    // Display Form
    echo "<form id=\"myForm\" method=\"post\">
        <tr>
            <td align=\"right\" class=\"gray dwl_gray\"><strong>Field:</strong></td>
            <td valign=\"top\"><input name=\"answer1\" type=\"text\" id=\"answer1\" size=\"40\" /></td>
        </tr>
        ...
    </table>

    <div class=\"mceActionPanel\">
        <div class=\"fl\"><input type=\"button\" id=\"insert\" name=\"insert\" value=\"Insert\" onclick=\"MyInsertDialog.insert();\" /></div>
        <div class=\"fr\"><input type=\"button\" id=\"cancel\" name=\"cancel\" value=\"Cancel\" onclick=\"tinyMCEPopup.close();\"/></div>
    </div>
    </form>";
}

因此，您单击编辑器中的按钮并加载对话框。我看到了2个问题。

首先，没有包含javascript。我可以切换到直接链接，但“最佳实践”是使用wp_enqueue_script所以我真的想要适应这个。

其次，表单底部是文本：“0”。它看起来无法找到功能相同的回调函数。我真的不需要回调函数，因为我只想使用my-dialog.js创建短代码并将其放入编辑器中。

Answer 1

为什么你不能这样做

第一点

function my_dialog_scripts() {
    wp_enqueue_script("jquery");
    wp_enqueue_script("tiny_mce_popup",MY_WP_PLUGIN_URL."/js/tiny_mce_popup.js");
    wp_enqueue_script("my-dialog",MY_WP_PLUGIN_URL."/js/my-dialog.js");
}
add_action('wp_enqueue_scripts', my_dialog_scripts);

第二点

您必须在回调函数结束时调用 die（）或退出函数（ my_dialog_window ）

在Wordpress插件对话框窗口上排队脚本

1 个答案: