完整示例代码
PHP 代码(functions.php)
// 注册 AJAX 处理程序
add_action('wp_ajax_my_favorite_action', 'my_favorite_action');
add_action('wp_ajax_my_review_action', 'my_review_action');
function my_favorite_action() {
// 检查用户是否登录
if (!is_user_logged_in()) {
wp_send_json(array('success' => false, 'message' => '请先登录'));
wp_die();
}
// 获取并验证 POST 数据
if (!isset($_POST['post_id']) || !is_numeric($_POST['post_id'])) {
wp_send_json(array('success' => false, 'message' => '无效的请求'));
wp_die();
}
$post_id = intval($_POST['post_id']);
$user_id = get_current_user_id();
// 处理收藏逻辑
$favorites = get_user_meta($user_id, 'favorites', true);
if (!$favorites) {
$favorites = array();
}
if (!in_array($post_id, $favorites)) {
$favorites[] = $post_id;
update_user_meta($user_id, 'favorites', $favorites);
wp_send_json(array('success' => true, 'message' => '收藏成功'));
} else {
wp_send_json(array('success' => false, 'message' => '已收藏'));
}
wp_die();
}
function my_review_action() {
// 检查用户是否登录
if (!is_user_logged_in()) {
wp_send_json(array('success' => false, 'message' => '请先登录'));
wp_die();
}
// 获取并验证 POST 数据
if (!isset($_POST['post_id']) || !is_numeric($_POST['post_id']) || !isset($_POST['review_type'])) {
wp_send_json(array('success' => false, 'message' => '无效的请求'));
wp_die();
}
$post_id = intval($_POST['post_id']);
$review_type = sanitize_text_field($_POST['review_type']);
// 处理好评和恶评逻辑
if ($review_type === 'good') {
$good_reviews = get_post_meta($post_id, 'good_reviews', true);
$good_reviews = $good_reviews ? $good_reviews + 1 : 1;
update_post_meta($post_id, 'good_reviews', $good_reviews);
wp_send_json(array('success' => true, 'message' => '好评成功', 'good_reviews' => $good_reviews));
} elseif ($review_type === 'bad') {
$bad_reviews = get_post_meta($post_id, 'bad_reviews', true);
$bad_reviews = $bad_reviews ? $bad_reviews + 1 : 1;
update_post_meta($post_id, 'bad_reviews', $bad_reviews);
wp_send_json(array('success' => true, 'message' => '恶评成功', 'bad_reviews' => $bad_reviews));
} else {
wp_send_json(array('success' => false, 'message' => '无效的评价类型'));
}
wp_die();
}
JavaScript 代码
document.addEventListener('DOMContentLoaded', function() {
document.querySelectorAll('.favorite-button').forEach(function(button) {
button.addEventListener('click', function() {
var postId = this.getAttribute('data-post-id');
console.log('发送 AJAX 请求,postId: ' + postId);
var xhr = new XMLHttpRequest();
xhr.open('POST', my_script_vars.ajaxurl, true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
xhr.onload = function() {
if (xhr.status >= 200 && xhr.status < 400) {
var response = JSON.parse(xhr.responseText);
console.log('AJAX 响应: ', response);
if (response.success) {
console.log(response.message);
alert('收藏成功');
} else {
alert(response.message);
}
} else {
console.error('服务器返回错误');
}
};
xhr.onerror = function() {
console.error('请求失败');
};
xhr.send('action=my_favorite_action&post_id=' + postId);
});
});
document.querySelectorAll('.review-button').forEach(function(button) {
button.addEventListener('click', function() {
var postId = this.getAttribute('data-post-id');
var reviewType = this.getAttribute('data-review-type');
console.log('发送 AJAX 请求,postId: ' + postId + ', reviewType: ' + reviewType);
var xhr = new XMLHttpRequest();
xhr.open('POST', my_script_vars.ajaxurl, true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
xhr.onload = function() {
if (xhr.status >= 200 && xhr.status < 400) {
var response = JSON.parse(xhr.responseText);
console.log('AJAX 响应: ', response);
if (response.success) {
console.log(response.message);
if (reviewType === 'good') {
var goodReviewCount = document.getElementById('good-review-count-' + postId);
goodReviewCount.textContent = response.good_reviews;
} else if (reviewType === 'bad') {
var badReviewCount = document.getElementById('bad-review-count-' + postId);
badReviewCount.textContent = response.bad_reviews;
}
} else {
alert(response.message);
}
} else {
console.error('服务器返回错误');
}
};
xhr.onerror = function() {
console.error('请求失败');
};
xhr.send('action=my_review_action&post_id=' + postId + '&review_type=' + reviewType);
});
});
});
详细步骤
-
确保 AJAX 请求正确发送:
- 确认 JavaScript 中的
ajaxurl
变量正确设置。 - 确认
action
参数与 PHP 中的wp_ajax_
钩子匹配。
- 确认 JavaScript 中的
-
检查 PHP 处理函数:
- 确认 PHP 处理函数中正确使用了
wp_send_json
返回包含success
字段的 JSON 响应。 - 确认函数中没有语法错误或逻辑错误。
- 确认 PHP 处理函数中正确使用了
-
调试和日志记录:
- 在 PHP 处理函数中添加
error_log
或var_dump
语句,以调试和检查变量值。 - 在 JavaScript 中添加
console.log
语句,以调试和检查 AJAX 请求和响应。
- 在 PHP 处理函数中添加