几秒钟后使消息消失

Question

我正在屏幕上显示错误消息，我希望这些消息在X秒后消失。我正在使用一个简单的脚本，如果屏幕上显示一条消息，则该脚本可以工作。 如果显示两条消息，请参见下面的示例，仅第一条消息消失，第二条消息保留在屏幕上。 如何删除两条消息？

我正在使用此脚本：

{% if form.errors %}
  {% for field in form %}
    {% for error in field.errors %}
      <div id="message">
        <div class="alert alert-warning alert-dismissible" role="alert">
          <button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;</span></button>
            {{ error|escape }}
        </div>
      </div>
    {% endfor %}
  {% endfor %}
  {% for error in form.non_field_errors %}
    <div class="alert alert-warning alert-dismissible" role="alert">
      <button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;</span></button>
        {{ error|escape }}
    </div>
  {% endfor %}
{% endif %}

生成消息的脚本。

{{1}}

谢谢您的帮助。

Answer 1

如果它不起作用，请尝试：

setTimeout(function(){
  $('.message').hide();
},1000);

Answer 2

尝试以下代码后，所有消息将从屏幕上消失。

$(".alert").show(() => {
    setTimeout(() => {
        $(".alert").fadeTo(500, 1).slideUp(500, () => {

            $(message).hide();
        })
    }, 5000)
});

谢谢大家的光临！