Question

我有一条简短的消息，当填写表格时显示“发布成功”。我在app.py上将Flash消息与python一起使用。

Post.html

<div class="posting">
<form class='blogform' action="/posts" method="post">
        <div class='blog_form_content'>
        <h2 class='blog_form_title'>Blog Post </h2>
        <h4 class='blog_form_subtitle'>create a post</h4>
        </div>
        {{ form.hidden_tag()}}
        <div class="box">Title: <div class='text'>{{ form.title }}</div> </div><br>
        <div class="box">Author: <div class='text'>{{ form.author }}</div></div><br>
        <div class="box">Content: <div class='content'>{{ form.content }}</div></div><br>
        <div class="box" style="float: right">{{ form.submit }} </div><br>
</form>

</div>
<div class='messages'>
{% with messages = get_flashed_messages() %}
    {% if messages %}
        {% for message in messages %}
            <li><div id='message'

这是我尝试添加我的JavaScript的地方。我希望此消息在几秒钟后消失。

{{ message }} </div> </li>
        {% endfor %}
    {% endif %}
{% endwith %}
</div>

这是我的app.py。

我不清楚是否需要使用此页面来连接javascript。

@app.route('/posts', methods=['POST', 'GET'])
def post():
    form = BlogForm()
    if form.validate_on_submit():
        new_blog = Blog(title=form.title.data,
                        author=form.author.data,
                        dateposted=datetime.now(),
                        content=form.content.data)
        db.session.add(new_blog)
        db.session.commit()
        flash("Posted Successfully")
        return redirect(url_for('post'))

    post = Blog.query.all()


    return render_template("posts.html", form=form, post=post)

如果有人可以帮助我，那就太好了。我是javascript新手。

Answer 1

我的代码如下：

                    <div class="flashwrapper">
                    {% with messages = get_flashed_messages(with_categories=True) %}
                        {% if messages %}
                            {% for category, message in messages %}
                                <div id=flashwrapper class="alert alert-{{ category }} alert-dismissible" role="alert">{{ message }}
                                <button type="button" class="close" data-dismiss="alert" aria-label="Close" onClick="close('flashwrapper')">
                                <span aria-hidden="true">&times;</span>
                                </div>
                            {% endfor %}
                        {% endif %}
                    {% endwith %}
                </div>

使用此js代码：

$(document).ready(function() {
setTimeout(function() {
    $('.alert').fadeOut('slow');
}, 2000); // <-- time in milliseconds

}）;

尝试用javascript使我的Flash显示后几秒钟后，我的消息消失。我的代码无法正常工作

1 个答案: