要实现无刷新的文章点赞功能，可以使用 Ajax 技术。以下是一个简单的例子，演示了如何使用 Ajax 在不刷新页面的情况下处理文章点赞：
HTML 页面：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Article Like Example</title>
<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
</head>
<body>
<!-- 显示文章内容 -->
<div id="articleContent">
<h2>Article Title</h2>
<p>This is the content of the article.</p>
<button id="likeButton" onclick="likeArticle()">Like</button>
<span id="likeCount">0</span> Likes
</div>
<script>
// 点赞文章的函数
function likeArticle() {
// 获取文章 ID，这里假设文章 ID 为 1
var articleId = 1;
// 发送 Ajax 请求
$.ajax({
type: 'POST',
url: 'like_article.php', // 替换为实际的服务器端处理脚本
data: { article_id: articleId },
success: function(response) {
// 更新页面上的点赞数
$('#likeCount').text(response);
},
error: function(error) {
console.error('Error liking article: ', error);
}
});
}
</script>
</body>
</html>
PHP 服务器端处理脚本（like_article.php）：
<?php
// 连接数据库，替换为实际的数据库连接信息
$servername = "your_server_name";
$username = "your_username";
$password = "your_password";
$dbname = "your_database_name";
$conn = new mysqli($servername, $username, $password, $dbname);
// 检查连接是否成功
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
// 获取文章 ID
$articleId = $_POST['article_id'];
// 更新数据库中的点赞数
$sql = "UPDATE articles SET like_count = like_count + 1 WHERE id = $articleId";
$conn->query($sql);
// 获取更新后的点赞数并返回
$sql = "SELECT like_count FROM articles WHERE id = $articleId";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
$row = $result->fetch_assoc();
echo $row['like_count'];
} else {
echo "0";
}
$conn->close();
本站原创内容，如需转载请注明来源：https://www.liutonghui.com/176.html
评论列表（0条）
暂时没有评论！