在AJAX中使用ajaxurl传递查询变量的正确方法

时间：2015-03-31 作者：Andrei Surdu

好的，我不知道该如何命名这个主题。

我试图用ajax覆盖默认行为。这里的问题实际上不是一个问题，而是一个更大的愿望。

我有以下url：

<a href="http://example.com/?reaction=smk_remove_post&id=1226&_nonce=7be82cd4a0" class="smk-remove-post">Remove post</a>
在functions.php 我有此功能，并在以下时间后立即调用：

function smk_remove_post(){
    if( !empty( $_GET[\'reaction\'] ) && \'smk_remove_post\' == $_GET[\'reaction\'] && !empty( $_GET[\'id\'] ) ){
        if( current_user_can(\'edit_others_posts\') && !empty($_GET[\'_nonce\']) ){
            if( wp_verify_nonce( esc_html( $_GET[\'_nonce\'] ), \'smk_remove_post\' ) ){
                // Delete the post
                wp_delete_post( absint( $_GET[\'id\'] ), true );
            }
        }
    }
}
smk_remove_post();
现在如果我点击ID为的帖子链接1226 将被删除。一切正常。任务成功完成，页面重新加载。

这就是我需要AJAX的地方。我想使用ajax处理此URL，而不是重新加载页面，and get a proper response.

我添加了以下jQuery脚本：

function smk_remove_post(){
    $(\'.smk-remove-post\').on( \'click\', function( event ){
        event.preventDefault();
        var _this = $(this);

        jQuery.ajax({
            type: "GET",
            url: _this.attr(\'href\'),
            success: function(response){
                console.log(response);
                _this.text(\'All great, the post is removed.\');
            }
        });
    });
}
smk_remove_post();
一切正常。该帖子通过ajax删除，无需重新加载页面。但我无法得到正确的响应，而是得到了当前页面的完整HTML源代码。

我知道我应该使用admin-ajax.php（ajaxurl），但我该怎么做呢？我需要从URL发送查询并获得回复。

Here is what I\'ve tryied:

我已将此添加到上面的jQuery脚本中：

data: {
    \'action\': \'smk_remove_post_ajax\',
},
这就是PHP：

function smk_remove_post_ajax(){
    smk_remove_post();
    die();
}
add_action(\'wp_ajax_smk_remove_post_ajax\', \'smk_remove_post_ajax\');
它不起作用。它被忽略了，前面的调用被替代执行，就像这将在没有ajax的情况下完成一样。

我知道我需要以某种方式将查询发送给admin ajax。php，但如何？

3 个回复
最合适的回答,由SO网友:Andrei Surdu 整理而成

我终于明白了。

第一个错误是处理同一个函数两次。我在函数之后调用了它一次，在ajax操作中又调用了一次。因此，在使用ajax调用时，函数执行了两次。在OP的示例中，这根本不是问题，因为它被简化为只做一件事，但在我的实际代码中，它做得更多，并可能导致丢失不需要的数据。

此外，我只需要停止ajax并获得自定义响应，仅此而已。以下是我所做的：

1. 我改变了这一点：

smk_remove_post();
对此：

add_action(\'parse_query\', \'smk_remove_post\');
在特殊操作中需要时，最好稍后运行该函数。

2. <接下来，我修改了ajax处理程序：我删除了这一行smk_remove_post(); 并将ajax操作从wp_ajax_smk_remove_post_ajax 到wp_ajax_smk_remove_post:

function smk_remove_post_ajax(){
    wp_die( \'ok\' );
}
add_action(\'wp_ajax_smk_remove_post\', \'smk_remove_post_ajax\');
3. 我已重命名查询字符串reaction 到action. 在url中更改了它，函数：

4. 最后修改了jQuery脚本。因此它使用了管理ajax。php并将url作为数据发送：

url: ajaxurl,
data: _this.attr(\'href\'),
以下是最终代码：

Link:

<a href="http://example.com/?action=smk_remove_post&id=1226&_nonce=7be82cd4a0" class="smk-remove-post">Remove post</a>

PHP code:

function smk_remove_post(){
    if( !empty( $_GET[\'action\'] ) && \'smk_remove_post\' == $_GET[\'action\'] && !empty( $_GET[\'id\'] ) ){
        if( current_user_can(\'edit_others_posts\') && !empty($_GET[\'_nonce\']) ){
            if( wp_verify_nonce( esc_html( $_GET[\'_nonce\'] ), \'smk_remove_post\' ) ){
                // Delete the post
                wp_delete_post( absint( $_GET[\'id\'] ), true );
            }
        }
    }
}
add_action(\'parse_query\', \'smk_remove_post\');

function smk_remove_post_ajax(){
    wp_die( \'ok\' );
}
add_action(\'wp_ajax_smk_remove_post\', \'smk_remove_post_ajax\');

Javascript:

function smk_remove_post(){
    $(\'.smk-remove-post\').on( \'click\', function( event ){
        event.preventDefault();
        var _this = $(this);

        jQuery.ajax({
            type: "GET",
            url: ajaxurl,
            data: _this.attr(\'href\').split(\'?\')[1],
            success: function(response){
                console.log(response); // ok
                _this.text(\'All great, the post is removed.\');
            }
        });
    });
}
smk_remove_post();
Edit:也是对上述代码的一个小更新。删除站点路径需要处理查询字符串，否则可能会产生意外问题。我已将此添加到data href:

.split(\'?\')[1]

SO网友:Rene Korss

像这样创建链接

<a href="http://example.com/?reaction=smk_remove_post&id=1226&_nonce=7be82cd4a0" data-id="1226" data-nonce="7be82cd4a0" class="smk-remove-post">Remove post</a>
和jQuery

$(\'.smk-remove-post\').on( \'click\', function( event ){
    event.preventDefault();
    var _this = $(this);

    var data = {
        \'action\': \'smk_remove_post_ajax\',
        \'reaction\': \'smk_remove_post\',
        \'id\': _this.data(\'id\'),
        \'_nonce\': _this.data(\'nonce\')
    };

    // since 2.8 ajaxurl is always defined in the admin header and points to admin-ajax.php
    jQuery.ajax({
        type: "GET",
        url: ajaxurl,
        data: data,
        success: function(response){
            console.log(response);
            _this.text(\'All great, the post is removed.\');
        }
    });
});
参见法典关于AJAX in Plugins.在法典中，它说：

大多数情况下，您应该在Ajax回调函数中使用wp\\u die（）。这提供了与WordPress更好的集成，并使测试代码更容易。

So使用wp_die(); 而不是die();

SO网友:Mark Kaplun

AJAX并不神奇，当您请求url X时，如果您从浏览器地址栏、链接或AJAX进行请求，您将收到该url的相同HTML。因此，如果您想要不同的响应，那么can not 对ajax请求使用与链接中相同的url。

Wordpress有一个特殊的“终点”来处理ajax请求-管理ajax。php和所有ajax请求应该只发送给它，比如$.ajax({url:....admin-ajax.php})

接下来，您需要让wordpress知道您想要做什么，并且在名为action. 此参数将标识服务器端用于处理请求的挂钩。您在代码中正确地完成了这一部分。

现在，您需要额外的参数来标识AJAX操作应该操作或检索哪个对象。您可以使用post的永久链接，例如post id，但这完全取决于您尝试执行的操作的复杂性。在您的特定情况下，我猜post id将是传入请求的最佳参数。

如何发送参数？大多数人在使用AJAX时都会发出POST请求，但如果您想获取，可以将其作为url的一部分传递（我认为这正是jquery为您所做的）。

结束
标签： php   ajax   query   urls   小码农  

相关推荐

WordPress META_QUERY不工作

我对自定义帖子类型的元查询有问题。设置了以下参数：$args = array( \'post_type\' => \'wp_comp_entries\', \'posts_per_page\' => -1, \'meta_query\' => array( \'relation\' => \'AND\', array(