在python语言,flask框架,mysql数据库下,在html页面实现点赞功能,并显示点赞数量
时间: 2024-03-13 20:45:49 浏览: 74
好的,我可以为你提供一个简单的实现思路。
首先,我们需要在数据库中存储每个文章/帖子的点赞数量,可以在文章表中添加一个字段来存储这个数据。假设我们的文章表名为 `articles`,点赞数量字段名为 `likes`。
在前端页面中,我们需要为每篇文章/帖子添加一个点赞按钮,点击按钮后通过 AJAX 请求向后端发送点赞请求。我们可以在路由中添加一个处理点赞请求的函数,示例代码如下:
```python
from flask import Flask, request, jsonify
from flask_mysqldb import MySQL
app = Flask(__name__)
app.config['MYSQL_HOST'] = 'localhost'
app.config['MYSQL_USER'] = 'root'
app.config['MYSQL_PASSWORD'] = 'password'
app.config['MYSQL_DB'] = 'database_name'
mysql = MySQL(app)
@app.route('/like', methods=['POST'])
def like():
article_id = request.form['article_id']
cur = mysql.connection.cursor()
cur.execute("UPDATE articles SET likes = likes + 1 WHERE id = %s", (article_id,))
mysql.connection.commit()
cur.close()
return jsonify({'status': 'success'})
```
这个路由接收一个 POST 请求,其中包含一个名为 `article_id` 的表单字段,表示用户点赞的文章/帖子 ID。在处理请求时,我们使用 MySQLDB 库执行一个 SQL 更新语句,将对应文章/帖子的点赞数量加一。最后返回一个 JSON 格式的响应,表示操作成功。
在前端页面中,我们可以通过 jQuery 等库来发送 AJAX 请求,并在请求成功后更新点赞数量的显示。示例代码如下:
```html
<!-- 假设文章 ID 为 1 -->
<div class="article">
<h2>这是一篇文章</h2>
<p>文章内容</p>
<span class="likes">0</span> 个人赞了这篇文章
<button class="like-button" data-article-id="1">点赞</button>
</div>
<script>
$(function() {
$('.like-button').click(function() {
$.post('/like', {'article_id': $(this).data('article-id')}, function(data) {
if (data.status == 'success') {
var likes = parseInt($('.likes').text());
$('.likes').text(likes + 1);
} else {
alert('点赞失败');
}
});
});
});
</script>
```
这段代码中,我们为点赞按钮添加了一个自定义属性 `data-article-id`,表示该按钮对应的文章/帖子 ID。当用户点击按钮时,我们通过 jQuery 的 `$.post` 方法向 `/like` 路由发送一个包含 `article_id` 字段的 POST 请求。在请求成功后,我们解析响应中的 `status` 字段,如果值为 `success`,则说明点赞成功,此时我们更新点赞数量的显示。否则,说明点赞失败,我们弹出一个提示框告知用户。
阅读全文