WordPress按钮触发ajax请求

Question

所以我实际上已经阅读了关于这个的stackoverflow问题，但是它们对于使用最新版本的wordpress来说有点太老了。

我的最终目标是提交我的表单中的一些数据到数据库，但现在ajax响应对我不起作用。在WP中的自定义页面加载中，将加载所有代码，以便所有函数都应正常工作。所有这些都在PHP文件中，为什么使用echo来创建JS脚本。这是我代码的重要部分

echo '<button id="ZapisPrace">Save</button>
<script>
jQuery("#ZapisPrace").click(function($){
    var data={
        action: "addToDB",
        info: "nomz"
    };
    jQuery.post(ajaxurl,data,function(response){
    alert("Response was "+ response);
    });
});
</script>';
add_action('wp_ajax_addToDB','pridajDoDB');
function pridajDoDB(){
    echo '<script>console.log("AAA")</script>';
    wp_die();
}

使用WP的当前版本，所以变量ajaxurl指向

/wordpress/wp-admin/admin-ajax.php

没有console.log发生，响应总是0，即使我删除pridajDoDB函数或add_action。只是没有正确触发ajax请求。有人能告诉我为什么吗？此外，我还没有使用像wp_localize_script、wp_register_script或wp_enqueue_script这样的函数，因为所有这些都在一个加载的PHP文件中，据我所知，我不需要导入jquery，因为它在wp中是默认可用的。我刚刚开始学习如何使用WP，PHP AJAX和jQuery，所以我还有很多东西要学。

PS：我应该使用使用ajax的WP方式。

Answer 1

好吧，所以我不知道上面的代码是如何工作的，但是我设法让它通过我在网上找到的不同的wp结构工作:

顺便说一句:我在这里使用onClick函数，但即使用jQuery click事件替换，它也能工作。

add_action('wp_ajax_addToDB','pridajDoDB');

echo '<button onClick='triggerAjax()'>Save</button>?>';

<script>
function triggerAjax(){
    <?php $nonce = wp_create_nonce( 'subbmitData' );?>//used so ajax response can verify from where is the request coming
    jQuery.ajax({
        type: "post",url: "admin-ajax.php",data: { action: 'addToDB', _ajax_nonce: '<?php echo $nonce; ?>' },
        success: function(html){
                console.log(html);//this will console log everything that happens in ajax called php function. Echo works as well.
            }
        });
    }
</script>
<?php

function pridajDoDB(){
    check_ajax_referer( "subbmitData" );//this check from where is the request coming from
    //here database commands works but if you echo or console log something it will be just passed to success function above
    die();
}
?>

Answer 2

更改 php 代码，如下所示。

add_action('wp_ajax_addToDB','addToDB');
function addToDB(){
    echo "AAA";
    wp_die();
}