我为前端题库/测验创建了一个自定义帖子模板,其中有两个元素:
当按下按钮时,显示问题文本的div将触发ajax查询,以从数据库中获取下一个问题
Code in functions.php
//Load ajax object for question bank
add_action(\'wp_enqueue_scripts\', \'my_enqueue\');
function my_enqueue(){
wp_enqueue_script( "question-refresh", get_stylesheet_directory_uri() . "/js/question-refresh.js", array("jquery") , null, true);
$question_nonce = wp_create_nonce( \'question\' );
wp_localize_script(
\'question-refresh\',
\'my_ajax_obj\',
array(
\'ajax_url\' => admin_url( \'admin-ajax.php\' ),
\'nonce\' => $question_nonce,
)
);
}
add_action(\'wp_ajax_nopriv_get_question\', \'get_question_from_database\');
add_action(\'wp_ajax_get_question\', \'get_question_from_database\');
function get_question_from_database(){
check_ajax_referer( \'question\' ); //Checks nonce
echo "<script type=\'text/javascript\'>alert(\'SCRIPTS LOADED\');</script>";
$question_number = rand(1,4);
$query = "SELECT * FROM `questions`
WHERE question_number = $question_number";
$result = $mysqli->query($query) or die($mysqli->error.__LINE__);
$question = $result->fetch_assoc();
echo json_encode(array("success" => true, "question-text"=>$question[\'question_text\']));
exit;
}
The code I have in my custom post template is as following:
<main>
<div class="container">
<div>Question 1 of 5</div>
<p id="question-container">
</p>
<button id="next-question" type="button">Next</button>
</div>
</main>
I have a separate js file stored in my-child-theme/js/question-refresh.js 我想我已经隔离了问题的来源。我显然对jQuery做了一些错误的事情。发布,因为它似乎没有运行。我是jQuery的新手,刚刚学习了其他问题和教程。如果有人能发现我做错了什么,我会非常感激的。非常感谢!
jQuery(document).ready(function($) {
$("#next-question").click( function() {
console.log("Hello");
$.post(
my_ajax_obj.ajax_url,
{
_ajax_nonce: my_ajax_obj.nonce,
"action": "get_question"
},
function(response) {
console.log("Hello");
console.log(response);
$("#question-container").text(response.question-text);
});
});
});
最合适的回答,由SO网友:Jacob Peattie 整理而成
我发现有两个问题。
首先,你的add_action(\'wp_ajax_nopriv_get_question\',...
代码在模板中,但在将请求发送到时不会加载模板wp-admin/admin-ajax.php
, 不会加载模板。回调代码和钩住它的代码需要放入主题的函数中。php文件。
其次,您只钩住了已注销用户的回调(nopriv_
). 这意味着当您登录时,该代码将不起作用。您需要为登录和注销的用户挂接:
add_action(\'wp_ajax_get_question\', \'get_question_from_database\');
add_action(\'wp_ajax_nopriv_get_question\', \'get_question_from_database\');