0

免责声明：不确定这是否与 WordPress 相关。

我正在按照一个简单的教程来检查 AJAX 是否在我的 WordPress 本地主机中工作。

我的 ajax-test.js ：

jQuery(document).ready( function($){
    $(".ajax-link").click( function(){
        var data = {
            action: 'test_response',
            post_var: 'this will be echoed back'
        };
        $.post(the_ajax_script.ajaxurl, data, function(response) {
                                                       alert(response);
                                                       });
        return false;
    });
});

在我的插件中，我将脚本添加到 wp_print_scripts() 并添加处理函数：

function test_ajax_load_scripts(){
    wp_enqueue_script("ajax-test", plugin_dir_url( __FILE__ ) . 'ajax-test.js', array( 'jquery' ) );
    wp_localize_script('ajax-test', 'the_ajax_script', array( 'ajaxurl' => admin_url('admin-ajax.php') ) );
}
add_action('wp_print_scripts', 'test_ajax_load_scripts');

function text_ajax_process_request(){ 
    if(isset($_POST["post_var"])){
        $response = $_POST["post_var"];
        echo $response;
        die();
    }
}
add_action('wp_ajax_test_response', 'test_ajax_process_request');

我得到带有 href="#" 的链接输出，然后单击它，它会将我带到页面顶部。我检查了 Firebug，我可以确认 ajax-test.js 已加载到标题中。控制台中没有任何内容。

我还能如何调试为什么警报没有发生？

4

2 回答 2

0

如果您返回 false 并且页面仍然跳到顶部，那么您将收到一个 javascript 错误。很可能$.post失败了。尝试向 中添加错误回调以$.post获取更多信息。

$.post(...).fail(function(){
    console.log(arguments)
});

另一种可能性是甚至没有到达点击处理程序。在这种情况下，请确保选择器正确，并且在运行代码时该元素存在于页面上。如果元素是由 ajax 或 javascript 添加的，您将需要在添加该元素后运行此代码，或者您需要使用事件委托附加事件.on或.delegate

$(document).on("click",".ajax-link",function(){...});
于 2012-06-04T18:00:52.270 回答
0

您的事件连接功能需要一个e.preventDefault()：

$(".ajax-link").click( function(e){ //<--------- e
    e.preventDefault(); //<-------- preventDefault()   
    var data = {
        action: 'test_response',
        post_var: 'this will be echoed back'
    };
    $.post(the_ajax_script.ajaxurl, data, function(response) {
        alert(response);
    });        
});
于 2012-06-04T18:02:24.070 回答