2012-06-04 8 views
0

Отказ от ответственности: не уверен, что это WordPress, связанный или нет.AJAX не отображается в Firebug Console

Я следую за simple tutorial, чтобы проверить, работает ли 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 загружается в заголовок. В консоли нет ничего.

Как еще я могу отладить, почему предупреждение не происходит?

ответ

0

Вашего проводом событий -up требуется 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); 
    });   
}); 
+1

Вы должны уметь избавиться от «return false»; with preventDefault тоже. – adamzwakk

+0

@adamzwakk yep, это правильно – Jason

0

Если вы вернули false и страница все еще прыгнула вверх, вы получаете ошибку javascript. Скорее всего, $.post не работает. Попробуйте добавить обратный вызов ошибки к $.post, чтобы получить дополнительную информацию.

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

Другая возможность заключается в том, что обработчик кликов даже не достигнут. В этом случае убедитесь, что селектор правильно и что элемент существует на странице при запуске кода. Если элемент добавляется AJAX или JavaScript, то вам нужно этот код для запуска после этого элемент был добавлен, или вам необходимо прикрепить событие с помощью делегирования событий с .on или .delegate

$(document).on("click",".ajax-link",function(){...}); 
Смежные вопросы