我很难让AJAX和jQuery与WP一起工作，我想知道是否有人能为我指明正确的方向。
我有一个表单，我想将表单中的数据传递给PHP函数，在那里返回数据，然后<div> 使用PHP函数处理的数据创建。我有一个版本在WP之外工作，但我似乎无法移植它。
我已经学习了很多教程，但似乎什么都不管用。我有下面的代码，它应该简单地用表单中的数据创建一个警报窗口，并在前面加上“hello”，但JS函数从未被调用过。它不断增加?name=name 到页面URL。
我还尝试创建一个单独的JS文件，并用..加载脚本。。
wp_enqueue_script(
\'myaddwordscript\',
plugins_url() . \'/MyPlugin/script.js\',
array( \'jquery\' )
非常感谢您的帮助。
<?php
/**
* Plugin Name: Addword
* Plugin URI: Addword
* Version: 1.0
*/
/**
* Make sure jquery is loaded
*/
function add_to_header() {
wp_enqueue_script(\'jquery\');
}
add_action( \'wp_enqueue_scripts\', \'add_to_header\' );
/**
* Add shortcode to show form and script
*/
function add_word( ) {
$script = "
<script>
jQuery(\'#ajax_form\').bind(\'submit\', function() {
alert(\'clicked\');
var form = jQuery(\'#ajax_form\');
var data = form.serialize();
data.action = \'add_word_to_form\'
jQuery.post(\'/wp-admin/admin-ajax.php\', data, function(response) {
alert(data);
});
return false;
});
</script>";
$form =\'
<form class="form" id="ajax_form">
<input type="text" name="name" id="name" placeholder="Word Goes Here" required="">
<input type="submit" value="Submit" id="submitaddword">
</form>\';
return $script.$form;
}
add_shortcode( \'addword\', \'add_word\' );
/**
* Set up AJAX call to add word
*/
add_action("wp_ajax_add_word_to_form", "add_word_to_form");
add_action("wp_ajax_nopriv_add_word_to_form", "add_word_to_form");
function add_word_to_form ($data)
{
return "Hello".$data;
}
?>
最合适的回答,由SO网友:czerspalace 整理而成
用文档包装javascript代码。准备好了，如果可以的话，我建议您回到外部文件中
jQuery(document).ready(function(){
jQuery(\'#ajax_form\').on(\'submit\', function(e) {
e.preventDefault();
console.log(\'Here\');
var form = jQuery(\'#ajax_form\');
var data = form.serialize();
data.action = \'add_word_to_form\'
jQuery.post(\'/wp-admin/admin-ajax.php\', data, function(response) {
alert(data);
});
//return false;
});
});
