layer弹窗自定义及向父页动态传参

最新推荐文章于 2021-09-14 18:02:45 发布

火雨_Nick

最新推荐文章于 2021-09-14 18:02:45 发布

阅读量1.9w

点赞数

分类专栏：前端开发各种Js插件使用方法整理文章标签： Java Web Java插件 layer 动态传参 sweetAlert

本文链接：https://blog.csdn.net/wp1603710463/article/details/50962782

版权

这篇博客介绍了如何在Java Web项目中利用layer插件创建弹窗，并实现向父页面动态传递参数。作者首先分享了layer插件的下载与基本使用，通过一个Demo展示弹窗的创建过程。在比较了sweetAlert的功能局限性后，选择了layer来完成更复杂的自定义内容加载需求。

摘要由CSDN通过智能技术生成

layer弹窗自定义及向父页动态传参

做项目中需要用到弹出框在父页面内弹出对话框供用户选择信息，然后将用户选择传回父页面的需求。查找网上资料，发现layer弹窗插件是个好东西，能完美的实现本人需要的功能。以下写一个小Demo记录下来，以便以后查找。

首先从官网下载js插件包。

layer官网：http://layer.layui.com/

下载后的包结构如下：

页面test.jsp部分代码如下：

<%@ page contentType="text/html; charset=utf-8" language="java"
	import="java.sql.*" errorPage=""%>
<%
    String path = request.getContextPath();
	// 获得本项目的地址(例如: http://localhost:8080/MyApp/)赋值给basePath变量    
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
	// 将 "项目路径basePath" 放入pageContext中，待以后用EL表达式读出。    
	pageContext.setAttribute("basePath", basePath);
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<script type="text/javascript" src="<%=basePath%>static/js/jquery-1.8.2.min.js"></script>
<script src="<%=basePath%>static/js/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" src="<%=basePath%>static/js/jquery.form.js"></script>
<script type="text/javascript" src="<%=basePath%>static/js/sweet-alert.min.js"></script>
<script type="text/javascript" src="<%=basePath%>static/layer/layer.js"></script>
<link rel="stylesheet" type="text/css" href="

最低0.47元/天解锁文章

火雨_Nick

关注

0
点赞
踩
5

收藏

觉得还不错? 一键收藏
0
评论
layer弹窗自定义及向父页动态传参

layer弹窗自定义及父页动态传参做项目中需要用到弹出框在父页面内弹出对话框供用户选择信息，然后将用户选择传回父页面的需求。查找网上资料，发现layer弹窗插件是个好东西，能完美的实现本人需要的功能。以下写一个小Demo记录下来，以便以后查找。首先从官网下载js插件包。 layer官网：http://layer.layui.com/
复制链接

扫一扫

专栏目录