Как загрузить Ajax в WordPress

Я знаком с использованием ajax обычным способом с помощью jQuery.
Некоторое время я играл вокруг него, но не понимаю, что WordPress должен заставить его работать …
То, что я здесь, взято из какого-то учебника или статьи.
Это находится в functions.php (в дочерней теме):

// code to load jquery - working fine // code to load javascript file - working fine // ENABLE AJAX : function add_ajax() { wp_localize_script( 'function', 'ajax_script', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) ); } $dirName = get_stylesheet_directory(); // use this to get child theme dir require_once ($dirName."/ajax.php"); add_action("wp_ajax_nopriv_function1", "function1"); // function in ajax.php add_action('template_redirect', 'add_ajax'); 

Сам jQuery загружается и работает нормально.

Я пробовал некоторые основные ajax, как показано ниже:

 jQuery(document).ready(function($){ $('a.link').click(function(){ $.ajax({ url: ajax_script.ajaxurl, data: ({action : 'function1'}), success: function(data){ $('#result').html(data); } }); return false; }); }); 

Помимо этого, я не знаю, как я могу проверить, правильно ли он загружен с самого начала …

Любая помощь здесь будет оценена по достоинству.

РЕДАКТИРОВАТЬ:
В firebug эта ошибка:

 ReferenceError: ajax_script is not defined url: ajax_script.ajaxurl, 

Solutions Collecting From Web of "Как загрузить Ajax в WordPress"

По вашему запросу я положил это в ответ за вас.

Как предложил Hieu Nguyen в своем ответе, вы можете использовать переменную javascript ajaxurl для ссылки на файл admin-ajax.php. Однако эта переменная не объявлена ​​на интерфейсе. Это просто объявить на переднем конце, поставив следующее в header.php вашей темы.

 <script type="text/javascript"> var ajaxurl = "<?php echo admin_url('admin-ajax.php'); ?>"; </script> 

Как описано в документации WordPress AJAX , у вас есть два разных крючка – wp_ajax_ (действие) и wp_ajax_nopriv_ (действие). Разница между ними:

  • wp_ajax_ (действие): Это срабатывает, если вызов ajax выполняется из панели администратора.
  • wp_ajax_nopriv_ (действие): это срабатывает, если вызов ajax выполняется из передней части веб-сайта.

Все остальное описано в документации, приведенной выше. Счастливое кодирование!

PS Вот пример, который должен работать. (Я не тестировал)

Передняя часть :

 <script type="text/javascript"> jQuery.ajax({ url: ajaxurl, data: { action: 'my_action_name' }, type: 'GET' }); </script> 

Задняя часть :

 <?php function my_ajax_callback_function() { // Implement ajax function here } add_action( 'wp_ajax_my_action_name', 'my_ajax_callback_function' ); // If called from admin panel add_action( 'wp_ajax_nopriv_my_action_name', 'my_ajax_callback_function' ); // If called from front end ?> 

ОБНОВЛЕНИЕ Несмотря на то, что это старый ответ, кажется, он продолжает получать большие пальцы от людей – это здорово! Я думаю, что это может быть полезно для некоторых людей.

WordPress имеет функцию wp_localize_script . Эта функция принимает в качестве третьего параметра массив данных, предназначенный для перевода, например:

 var translation = { success: "Success!", failure: "Failure!", error: "Error!", ... }; 

Таким образом, это просто загружает объект в тег заголовка HTML. Это можно использовать следующим образом:

Бэкэнд :

 wp_localize_script( 'FrontEndAjax', 'ajax', array( 'url' => admin_url( 'admin-ajax.php' ) ) ); 

Преимущество этого метода заключается в том, что он может использоваться как в плагинах тем, так и в качестве тем, которые вы не жестко кодируете в URL-адрес переменной ajax URL.

На переднем конце URL теперь доступен через ajax.url , а не просто ajaxurl в предыдущих примерах.

Во-первых, вы должны прочитать эту страницу полностью http://codex.wordpress.org/AJAX_in_Plugins

Во-вторых, ajax_script не определен, поэтому вы должны изменить на: url: ajaxurl . Я не вижу вашу function1() в приведенном выше коде, но вы уже можете определить ее в другом файле.

И, наконец, узнайте, как отлаживать вызов ajax с помощью Firebug, вкладки в сети и консоли будут вашими друзьями. На стороне PHP, print_r() или var_dump() будут вашими друзьями.

Лично я предпочитаю делать ajax в wordpress так же, как и делать ajax на любом другом сайте. Я создаю процессорный php-файл, который обрабатывает все мои запросы ajax и просто использует этот URL. Так вот, из-за htaccess не совсем возможно в wordpress, поэтому я делаю следующее.

1. в моем файле htaccess, который живет в моей папке wp-content, я добавляю это ниже того, что уже есть

 <FilesMatch "forms?\.php$"> Order Allow,Deny Allow from all </FilesMatch> 

В этом случае файл моего процессора называется forms.php – вы поместили бы это в свою папку wp-content / themes / themeName вместе со всеми вашими другими файлами, такими как header.php footer.php и т. Д. … он просто живет в вашей теме корень.

2.) В моем коде ajax я могу использовать свой url как это

 $.ajax({ url:'/wp-content/themes/themeName/forms.php', data:({ someVar: someValue }), type: 'POST' }); 

очевидно, вы можете добавить любые ваши вещи до, успеха или типа ошибки, которые вы хотели бы … но да, это (я считаю), более простой способ сделать это, потому что вы избегаете всей глупости, говорящего в WordPress в 8 разных местах, что и это также позволит вам избежать других вещей, которые вы видите, когда люди делают, где они помещают js-код на уровне страницы, чтобы они могли окунуться в php, где я предпочитаю, чтобы мои файлы js были разделены.

Используйте wp_localize_script и передайте URL:

 wp_localize_script( some_handle, 'admin_url', array('ajax_url' => admin_url( 'admin-ajax.php' ) ) ); 

затем внутри js, вы можете называть его

 admin_url.ajax_url 

Я думал, что, поскольку файл js уже загружен, мне не нужно было загружать / завершать его снова в отдельной функции add_ajax.
Но это должно быть необходимо, или я сделал это, и теперь он работает.

Надеюсь, это поможет кому-то другому.

Вот исправленный код из вопроса:

 // code to load jquery - working fine // code to load javascript file - working fine // ENABLE AJAX : function add_ajax() { wp_enqueue_script( 'function', 'http://host/blog/wp-content/themes/theme/js.js', array( 'jquery' ), '1.0', 1 ); wp_localize_script( 'function', 'ajax_script', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) ); } $dirName = get_stylesheet_directory(); // use this to get child theme dir require_once ($dirName."/ajax.php"); add_action("wp_ajax_nopriv_function1", "function1"); // function in ajax.php add_action('template_redirect', 'add_ajax');