WordPress 使用 jQuery 删除存储在 wp_options 中的数据

问题描述

我想知道有没有人可以就我的问题进一步告诉我。我的插件的一部分存储日志文件进行调试。我已经使用 jquery 和 wp_localise_script 在我的管理页面中的 (div＃log) 中成功显示了它们。我有一个按钮来删除这些日志，但我不确定如何处理这个。我有一种感觉，ajax 可能会派上用场，但不知道从哪里开始。

以下是我的代码的相关部分：

admin_enqueue_scripts(动作)

 $args = array(get_option('wow_tweets_log'));//log files fetched from wp_options table
    wp_enqueue_script('wow_tweet');//registered earlier on with jQuery dependency
    wp_localize_script('wow_tweet', 'wow_vars', $args);

管理页面

<tr><th scope="row"><strong>Debugging</strong></th><td>
    <div id="debug" class="button-primary">Debug</div><!--debug button shows logs-->
    <div id="hide_debug" class="button-secondary">Hide</div><!--debug button hides logs-->
    <div id="clear_log" class="button-secondary">Empty Log</div><!--Press to delete logs-->
</td></tr>
<tr><th scope="row"></th><td><div id="log"><!--Logs show here--></div></td></tr>

使用 Javascript

jQuery(document).ready(function() {

    var debug_show = jQuery('#log').hide();//hides log by default

    jQuery('#debug').click(function(){//on click shows logs files in div#log
        for (var i = 0, l = wow_vars.length; i < l; i++) {
            var data = wow_vars[i];
        }
        jQuery('#log').show().html(data);

    });
    jQuery('#hide_debug').click(function()
    {
        debug_show.hide();
    });
});

采取行动清除日志

 function clear_log(){
    delete_option('wow_tweets_log');//am stuck on how to invoke this

    /*die();  would go at the end if ajax used*/
 }
 add_action('clear_log','clear_log');

到目前为止，这个脚本正在努力显示所有的日志文件，现在我需要的是在点击＃clear_log 时删除它们。我知道在 init 上插入一个 do_action 将会在页面加载后立即删除它们，这样我的 javascript 就没用了，所以我猜只有这个选项是 ajax！我需要添加另一个参考到 wp_localize_script() 吗？任何帮助将不胜感激。

最佳解决方案

WordPress 中的 Ajax 通过发送 HTTP 消息到/wp-admin/admin-ajax.php(默认情况下)，然后触发相应的挂钩。所以，你附加一些 jQuery 到一个事件触发你的删除按钮，然后发布到 admin-ajax.php，它有一个动作，例如， delete_my_options()，实际上运行 php 删除。然后，您有一个称为回调的函数，该函数在成功完成 ajax 请求时运行。你可以使用它来淡化你的 #log div，例如。

总之，你有三个步骤，动作，ajax 和回调。该操作由 DOM 事件触发，并附加到两个钩子，wp_ajax_ {action_name} 和 wp_ajax_nopriv_ {action_name}(仅当您希望没有登录的用户能够执行此操作时) 。当该动作发布到 wp-admin /admin-ajax.php 时，这些消息就会发生。 ajax 是连接到它们的 php(通常) 函数。回调函数是一个 javascript 函数，当 ajax 成功完成时触发。

一步步：

步骤 1，在你的 js 文件

jQuery('#hide_debug').click(function()
{
    var data = {};
    data.action = 'clear_log_action';
    data.options_delete_nonce = ajax_object.options_delete_nonce;
    jQuery.post(ajax_object.ajax_url, data, clear_log_callback);

});

第 2 步，在你的 functions.php 或插件

将其添加到从您排队您的 JavaScript 的功能：(感谢 @Milo)

wp_localize_script( 'my_js_file_name', 'ajax_object', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ,   'options_delete_nonce' => wp_create_nonce( 'options_delete_nonce' ), ) );

然后将其添加到您的 functions.php 或插件中：

// Edit: removed the nopriv hook (Thanks @toscho)
add_action('wp_ajax_clear_log_action','clear_log_ajax'); // attach your data.action to wp_ajax and wp_ajax_nopriv and hook your php function
function clear_log_ajax() {
    $nonce = $_POST['options_delete_nonce'];
    // Edit: Added nonces and permissions check (Thanks @Otto)
    if( wp_verify_nonce( $nonce, 'options_delete_nonce' ) && current_user_can( 'manage_options' ) ) {
        delete_option('wow_tweets_log');
        die(); // make sure to put a die() or exit() at the end of your ajax
    }
}

步骤 3，回到你的 js 文件

// output will be what is echoed from your ajax, if anything
function clear_log_callback(output)
{
    jQuery('#log').hide();
}

参考文献

Using jQuery to delete data stored in wp_options

注：本文内容整合自 Google/Baidu/Bing 辅助翻译的英文资料结果。如果您对结果不满意，可以加入我们改善翻译效果：薇晓朵技术论坛。

WordPress 使用 jQuery 删除存储在 wp_options 中的数据