web 后台管理消息弹窗实现

最新推荐文章于 2024-05-12 16:16:05 发布

hadoopxsy

最新推荐文章于 2024-05-12 16:16:05 发布

阅读量8.6k

点赞数 4

分类专栏： web网站开发之路文章标签： web 消息弹窗

本文链接：https://blog.csdn.net/hadoopxsy/article/details/79545095

版权

web网站开发之路专栏收录该内容

14 篇文章 1 订阅

订阅专栏

做网站后台管理保存消息或者删除数据，完成操作时能够给用户一个很好的信息提示：操作成功或者操作失败等等，，，
说明：
**listInfo.action 展示方法完成之后跳转到展示信息主页
saveInfo.action 保存方法**
保存完成之后跳转到展示方法上，再跳转到展示主页。

    **java后台：**

    public String saveInfo(HttpServletRequest request,RedirectAttributes attr) {
                    if(操作成功){
                        attr.addFlashAttribute("message", "保存成功!");
                  }else{
                      attr.addFlashAttribute("message", "保存失败!");
                  }
                  return "redirect:/Info/listInfo.action";
}

***展示信息主页jsp：***
    **js:**

<script>
            $(function(){
                $('.message_alert').show(300).delay(2500).hide(300);
            })
        </script>

**css:**

<style>
            .message_alert {
                position:absolute;
                top: 30%;
                left: 50%;
                width: 20%;
                text-align: center;
                background: #3bb4f2;
                opacity: 1;
                z-index: 999;
                padding: 5px 0;
                color: white;
                display: none;
            }       
        </style>

    <html>
        <c:if test="${not empty message}">
                <div class="message_alert">${message}</div>
        </c:if>
    </html>

子操作页面（例如：信息详情页面）的返回操作：

<button type="button" onclick="goBack()">返回</button>

js:

function goBack(){
                window.location.href="${adminPath}/Info/listInfo.cation";
            }

hadoopxsy

关注

4
点赞
踩
13

收藏

觉得还不错? 一键收藏
2
评论
web 后台管理消息弹窗实现

做网站后台管理保存消息或者删除数据，完成操作时能够给用户一个很好的信息提示：操作成功或者操作失败等等，，，说明： **listInfo.action 展示方法完成之后跳转到展示信息主页 saveInfo.action 保存方法** 保存完成之后跳转到展示方法上，再跳转到展示主页。 **java后台：** public St
复制链接

扫一扫