上一篇文章我们已经知道如何利用Django弹出简单的消息提示框,文章链接:Django如何弹出简单的消息提示框
但是这样的界面有点丑,界面没有优化,下面介绍如何引入bootstrap的模态框作为自己的消息提示框,你会发现提示框比以前好看多了
1、引入bootstrap框架
Hello, world!Hello, world!
2、加入模态框代码
代码如下:
3、JS代码
{% if messages %}
$(document).ready(function(){
{% for msg in messages %}
// 把Django返回的消息内容更新为模态框的内容 通过id号查找
$("#messageModal").find("#message-body").html('{{ msg.message }}');
// 显示模态框
$("#messageModal").modal('show');
{% endfor %}
});
{% endif %}
4、测试
效果如下: