下面是一个使用PHP和AJAX实现投票功能的示例：
首先，创建一个名为index.php的文件，其中包含以下代码：
<!DOCTYPE html>
<html>
<head>
<title>AJAX Voting System</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('.vote-btn').click(function(){
var vote = $(this).data('vote');
var postId = $(this).data('post-id');
$.ajax({
url: 'vote.php',
method: 'POST',
data: {vote: vote, postId: postId},
success: function(response){
if(response == 'success'){
$('#post-'+postId+' .vote-count').text(function(i, oldText){
return parseInt(oldText) + 1;
});
}
}
});
});
});
</script>
<style>
.vote-btn {
cursor: pointer;
color: blue;
text-decoration: underline;
}
</style>
</head>
<body>
<h1>Voting System</h1>
<div id="post-1">
<h2>Post 1</h2>
<p>Vote count: <span class="vote-count">0</span></p>
<p><span class="vote-btn" data-vote="up" data-post-id="1">Upvote</span> | <span class="vote-btn" data-vote="down" data-post-id="1">Downvote</span></p>
</div>
<div id="post-2">
<h2>Post 2</h2>
<p>Vote count: <span class="vote-count">0</span></p>
<p><span class="vote-btn" data-vote="up" data-post-id="2">Upvote</span> | <span class="vote-btn" data-vote="down" data-post-id="2">Downvote</span></p>
</div>
</body>
</html>
在上述示例中，我们使用了jQuery库来简化AJAX请求的处理。我们为每个投票按钮（Upvote和Downvote）添加了一个click事件监听器。当用户点击按钮时，会触发AJAX请求。
AJAX请求发送到名为vote.php的服务器端脚本，并将投票类型（up或down）以及帖子ID作为POST参数发送。服务器端脚本将根据投票类型和帖子ID执行相应的投票操作，并返回成功或失败的响应。
如果投票成功，则在成功的回调函数中更新对应帖子的投票计数。我们通过找到该帖子的投票计数元素（<span class="vote-count">）并将其值加1来实现。
接下来，创建一个名为vote.php的文件，其中包含以下代码：
<?php
// 模拟数据库中的投票计数
$votes = array(
1 => 0,
2 => 0
);
// 获取投票类型和帖子ID
$vote = $_POST['vote'];
$postId = $_POST['postId'];
// 执行投票操作
if($vote == 'up'){
$votes[$postId]++;
} elseif($vote == 'down'){
$votes[$postId]--;
}
// 模拟投票成功
echo 'success';
?>
在上述示例中，我们模拟了一个包含帖子ID和对应投票计数的数据库数组。当接收到来自AJAX请求的投票类型和帖子ID时，我们根据投票类型更新相应帖子的投票计数。
服务器端脚本返回一个成功的响应，以通知客户端投票操作已成功执行。
请确保将index.php和vote.php文件放在同一个目录下，并在Web服务器上运行index.php。当用户点击Upvote或Downvote按钮时，将向服务器发送AJAX请求并更新对应帖子的投票计数。