Question

这是我的layout.html


<!DOCTYPE html>
{% load static %}
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">

    <title>Mikayıl`ın Bloğu</title>
</head>
<body>
    {% include "includes/navbar.html" %}




        <div style = "margin-top : 100px; margin-bottom:100px;" class = "container">

            {% include "includes/messages.html" %}



            {% block body %}

            {% endblock body %}

        </div>


    <script src="{% static 'js/jquery-3.2.1.min.js'%} "></script>
    <script src="{% static 'js/bootstrap.min.js'%} "></script>
    <script>
        $(document).ready(function() {
            // messages timeout for 10 sec 
            setTimeout(function() {
                $('.message').fadeOut('slow');
            }, 10000); // <-- time in milliseconds, 1000 =  1 sec

            // delete message
            $('.del-msg').live('click',function(){
                $('.del-msg').parent().attr('style', 'display:none;');
            })
        });
    </script>

</body>
</html>

这是我的message.html这个文件是template / includes中的文件夹，但是我将它添加到layout.html中到

{% if messages %}

    {% for message in messages %}
    {% if message.tags == "info" %}
    <div class="alert alert-danger">{{ message }}</div>

    {% else %}
    <div  class="alert alert-{{ message.tags }}">{{ message }}</div>

    {% endif %}

    {% endfor %}

{% endif %}

我看着stackoverflow有一个与我尝试过的主题相同的主题，但是我无法实现自己的目标

但是我无法发出成功的消息，该消息会在5秒后消失，谁能帮助我：）

Answer 1

您的js和html部分中的类名称不同，只需将.message更改为.alert即可。

几秒钟后使成功消息消失:(

1 个答案: