Question

我正在用Python Flask编写应用程序，并且正在使用Javascript构建交互式的“赞”按钮。

这是我的路线：

@app.route('/jquery')
def jquery():
    posts = Post.query.all()
    return render_template('jquery.html', posts=posts)

在 jquery.html 模板中，我有：

{% for p in posts %}
{% if p.upvotes %}
{% set pupvotes = p.upvotes %}
{% else %}
{% set pupvotes = 0 %}
{% endif %}

<p>{{ p.author.username }} says: <b>{{ p.body }}</b>&nbsp;&nbsp;<button id=" 
{{ p.id }}" onclick="document.getElementById('{{ p.id }}').innerHTML = {{ 
pupvotes }} +1  + ' Likes'">{{ pupvotes }} Likes</button></p>

{% endfor %}

一切实际上都以这种方式工作，但是我想保存+1点赞点击的结果并将其转移到Python变量中，以便我可以将其添加到数据库中，并在刷新后在页面上显示更新的点赞数字

我试图通过这种方式使用JavaScript函数：

<script>
function myF1() {
    document.getElementById('{{ p.id }}').innerHTML = {{ pupvotes }} +1  + ' 
Likes';
}
</script>

和：

onclick="myF1()"

但是，无论我单击哪个“喜欢”按钮，只有页面上的最后一个“喜欢”都会通过单击进行更新。

Answer 1

您已经接近了，但是，正如@MartijnPieters指出的那样，您仍然需要与后端进行交流，以更新该帖子的点赞次数。为此，请稍微更改您的HTML以包括一个按钮，以使用类和ID更新喜欢的按钮。该ID将与发布ID相同，并且该类将是通用的。然后，在创建html.hs-messages-widget-open.hs-messages-mobile height: 100% !important overflow: hidden !important position: relative !important body height: 100% !important overflow: hidden !important position: relative !important margin: 0 !important #hubspot-messages-iframe-container display: initial !important z-index: 2147483647 position: fixed !important bottom: 0 !important right: 0 !important &.internal z-index: 1016 iframe min-width: 108px .shadow display: initial !important z-index: -1 position: absolute width: 0 height: 0 bottom: 0 right: 0 content: "" &.internal display: none !important &.active width: 400px height: 400px background: radial-gradient(ellipse at bottom right, rgba(29, 39, 54, 0.16) 0, rgba(29, 39, 54, 0) 72%) iframe display: initial !important width: 100% !important height: 100% !important border: none !important position: absolute !important bottom: 0 !important right: 0 !important background: transparent !important之后，将jquery与ajax一起使用。

首先，在Python后端中，创建一条路由来处理帖子的点赞更新：

script

我建议返回一个@app.route('/update_like') def update_likes(): _id = int(flask.request.args.get('post_id')) #Do something to update the database return flask.jsonify({'success':'True'})化的响应，以便您处理可能发生的错误，例如用户两次喜欢某个帖子。如果发现是这种情况，则可以返回json并在前端相应地进行处理。

然后，在HTML中：

flask.jsonify({'success':'False'})

Answer 2

好的，我已经做到了：

这是我们的烧瓶路线：

memcpy()

这是带有一些jQuery的HTML页面：

@app.route('/ulk')
def ulk():
    ppp = request.args.get('p', 0, type=int)
    lpost = Post.query.filter_by(id=ppp).first()
    lpost.upvotes += 1
    db.session.commit()
    return jsonify(result=ppp)

Jinja“ for”循环中的Javascript

2 个答案: