Update pmember.jsp

pull/1/head
pw6qtp7hv 8 months ago
parent 868116f0ae
commit cae50accac

@ -2,51 +2,74 @@
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<% <%
// 获取当前项目的上下文路径,后续用于构建完整的资源访问路径,例如样式表、脚本文件、图片等资源的引用地址都会基于此路径来拼接,方便在不同部署环境下准确找到对应的资源。
String path = request.getContextPath(); String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; // 构建项目的基础路径将协议如http或https、服务器名称、服务器端口以及前面获取的上下文路径组合起来形成一个完整的、可用于定位项目内各种资源的基础URL地址。
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%> %>
<!--_meta 作为公共模版分离出去--> <!--_meta 作为公共模版分离出去-->
<!DOCTYPE HTML> <!DOCTYPE HTML>
<html> <html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="Bookmark" href="/favicon.ico" >
<link rel="Shortcut Icon" href="/favicon.ico" />
<!--[if lt IE 9]>
<script type="text/javascript" src="lib/html5shiv.js"></script>
<script type="text/javascript" src="lib/respond.min.js"></script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="<%=basePath%>static/h-ui/css/H-ui.min.css" />
<link rel="stylesheet" type="text/css" href="<%=basePath%>static/h-ui.admin/css/H-ui.admin.css" />
<link rel="stylesheet" type="text/css" href="<%=basePath%>lib/Hui-iconfont/1.0.8/iconfont.css" />
<link rel="stylesheet" type="text/css" href="<%=basePath%>static/h-ui.admin/skin/default/skin.css" id="skin" />
<link rel="stylesheet" type="text/css" href="<%=basePath%>static/h-ui.admin/css/style.css" />
<!--[if IE 6]>
<script type="text/javascript" src="lib/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script>
<![endif]-->
<!--/meta 作为公共模版分离出去-->
<title>查看详情</title> <head>
<!-- 设置页面的字符编码为utf-8确保页面能正确显示各种字符避免出现乱码情况这是HTML页面中常见的基本设置。 -->
<meta charset="utf-8">
<!-- 定义页面在不同浏览器渲染引擎下的兼容模式这里指定了webkit常用于Chrome、Safari等现代浏览器、ie-comp用于兼容IE浏览器的某些特定模式、ie-stand标准IE模式等多种模式目的是尽量让页面在各类浏览器中都能正常显示提高兼容性。 -->
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<!-- 强制让页面以IE的最高版本模式或者Chrome浏览器的模式进行渲染主要是为了解决IE浏览器在处理一些现代网页标准时可能出现的兼容性问题确保页面呈现效果符合预期。 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<!-- 设置页面的视口viewport属性规定页面宽度等于设备宽度初始缩放比例、最小缩放比例和最大缩放比例都设定为1.0,并且禁止用户手动缩放页面,这样能保证页面在移动设备上有较好的布局和展示效果,适应不同屏幕尺寸的设备。 -->
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<!-- 禁止浏览器对页面进行缓存,意味着每次访问该页面时,浏览器都会向服务器重新请求页面内容,常用于页面内容经常更新、需要实时获取最新数据的情况。 -->
<meta http-equiv="Cache-Control" content="no-siteapp" />
<!-- 设置页面的书签图标Bookmark链接指向/favicon.ico文件这个图标通常会在浏览器的书签栏中显示方便用户识别和区分不同的页面书签。 -->
<link rel="Bookmark" href="/favicon.ico" >
<!-- 设置页面的快捷图标Shortcut Icon链接同样指向/favicon.ico文件该图标一般会在浏览器的标签页、地址栏等位置显示起到标识页面的作用。 -->
<link rel="Shortcut Icon" href="/favicon.ico" />
<!-- 条件注释当浏览器版本小于IE9时引入html5shiv.js和respond.min.js这两个脚本文件。html5shiv.js用于让低版本的IE浏览器IE8及以下能够识别和支持HTML5标签respond.min.js则是让低版本IE浏览器支持CSS3的媒体查询特性从而提升页面在旧版IE中的兼容性和显示效果。 -->
<if lt IE 9>
<script type="text/javascript" src="lib/html5shiv.js"></script>
<script type="text/javascript" src="lib/respond.min.js"></script>
<![endif]>
<!-- 引入H-ui框架的核心样式表文件用于构建页面的基本样式布局比如设置页面的字体、颜色、间距等通用样式为整个页面提供一个统一的外观基础。 -->
<link rel="stylesheet" type="text/css" href="<%=basePath%>static/h-ui/css/H-ui.min.css" />
<!-- 引入H-ui.admin框架的样式表文件该文件针对后台管理系统页面进行了样式定制包含了更多符合后台管理界面风格和操作需求的样式规则例如表单样式、表格样式、按钮样式等。 -->
<link rel="stylesheet" type="text/css" href="<%=basePath%>static/h-ui.admin/css/H-ui.admin.css" />
<!-- 引入Hui-iconfont图标字体库的样式表文件通过这个文件可以在页面中使用相应的图标字体来展示各种图标图标字体的优点是可以方便地通过CSS样式进行大小、颜色等属性的调整并且在不同分辨率下能保持较好的显示效果增强页面的可视化效果和交互性。 -->
<link rel="stylesheet" type="text/css" href="<%=basePath%>lib/Hui-iconfont/1.0.8/iconfont.css" />
<!-- 引入H-ui.admin框架的默认皮肤样式表文件用于设置页面的整体皮肤风格id属性设置为"skin"方便后续通过JavaScript等方式实现动态切换皮肤的功能满足不同用户对于页面外观风格的个性化需求。 -->
<link rel="stylesheet" type="text/css" href="<%=basePath%>static/h-ui.admin/skin/default/skin.css" id="skin" />
<!-- 引入H-ui.admin框架的额外样式表文件可能包含一些自定义的样式规则用于进一步细化和调整页面的外观显示例如对某些特定元素的样式进行补充或覆盖框架默认样式中的相关设置以实现更精准的页面设计效果。 -->
<link rel="stylesheet" type="text/css" href="<%=basePath%>static/h-ui.admin/css/style.css" />
<!-- 条件注释当浏览器版本为IE6时引入DD_belatedPNG_0.0.8a-min.js脚本文件并执行相应的函数来修复IE6下PNG图片透明等显示问题确保页面中的PNG图片在IE6浏览器中能正常显示避免出现显示异常的情况。 -->
<if IE 6>
<script type="text/javascript" src="lib/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script>
<![endif]>
<!--/meta 作为公共模版分离出去-->
<title>查看详情</title>
</head> </head>
<body> <body>
<article class="page-container"> <!-- 使用article标签创建一个页面区域通常用于表示独立的、自包含的内容块在这里作为展示会员详情信息的容器方便对这部分内容进行整体的样式设置和布局管理。 -->
<article class="page-container">
<!-- 创建一个表单form虽然action属性为空可能在实际应用中会通过JavaScript动态设置或者根据页面逻辑在其他地方补充完整method属性设置为"post"表示表单数据将以POST方式提交class属性用于应用相关的样式类来设置表单的外观样式id属性用于唯一标识这个表单方便后续通过JavaScript等方式进行操作和交互。 -->
<form action="" method="post" class="form form-horizontal" id="form-member-add"> <form action="" method="post" class="form form-horizontal" id="form-member-add">
<!-- 创建一个行row容器用于布局内部的标签和表单控件cl类可能是用于设置一些列相关的样式规则具体取决于所使用的样式框架定义常见的作用是控制不同屏幕尺寸下元素的布局排列方式等。 -->
<div class="row cl"> <div class="row cl">
<!-- 创建一个表单标签label用于显示提示文本通过设置类名来控制在不同屏幕尺寸超小屏幕xs和小屏幕sm下所占的列数这里col-xs-4 col-sm-3表示在超小屏幕下占4列小屏幕下占3列以此来布局标签在页面中的位置同时使用<span class="c-red">*</span>可以添加红色的星号用于提示该字段为必填项虽然这里视觉效果上可能还需要结合CSS样式进一步调整。 -->
<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>会员资料ID</label> <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>会员资料ID</label>
<!-- 创建一个表单控件所在的容器同样通过类名控制在不同屏幕尺寸下的宽度等布局样式这里设置了宽度为300px用于放置具体的表单输入控件。 -->
<div class="formControls col-xs-8 col-sm-9" style="width:300px;"> <div class="formControls col-xs-8 col-sm-9" style="width:300px;">
<!-- 创建一个文本输入框input设置为禁用状态disabled="disabled"意味着用户不能修改该输入框中的内容其值通过JSTL表达式${pmember.pmemberId}从后台传递过来的数据中获取并显示同时设置了占位符placeholder为空并且没有设置id和name属性在实际应用中如果需要通过JavaScript操作或者表单提交时传递该值最好还是设置合适的id和name属性。 -->
<input type="text" disabled="disabled" class="input-text" value="${pmember.pmemberId}" placeholder="" id="" name=""> <input type="text" disabled="disabled" class="input-text" value="${pmember.pmemberId}" placeholder="" id="" name="">
</div> </div>
</div> </div>
<div class="row cl"> <div class="row cl">
<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>姓名:</label> <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>姓名:</label>
<div class="formControls col-xs-8 col-sm-9" style="width:300px;"> <div class="formControls col-xs-8 col-sm-9" style="width:300px;">
<!-- 创建一个文本输入框用户可以进行输入操作这里没有设置禁用属性与上面会员资料ID输入框不同其值通过JSTL表达式${pmember.realName}从后台获取并显示设置了占位符为空同时设置了id为"realName"和name为"realName"方便后续通过JavaScript验证或者表单提交时传递该字段的值。 -->
<input type="text" class="input-text" value="${pmember.realName}" placeholder="" id="realName" name="realName"> <input type="text" class="input-text" value="${pmember.realName}" placeholder="" id="realName" name="realName">
</div> </div>
</div> </div>
@ -70,27 +93,28 @@
</div> </div>
<div class="row cl"> <div class="row cl">
<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3"> <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
<!-- 创建一个按钮通过input标签设置类型为button来模拟按钮样式添加了多个类用于设置按钮的样式如btn btn-primary radius表示这是一个主要的、具有特定样式的圆角按钮按钮文本为"返回"点击该按钮会触发相应的操作这里通过包裹在a标签中并设置href属性指向GetAllPrepServlet可能是用于返回上一页面或者获取全部准备数据的Servlet地址具体功能要看后台的实现逻辑实现点击按钮返回相应页面的功能。 -->
<a href="<%=basePath%>GetAllPrepServlet"> <a href="<%=basePath%>GetAllPrepServlet">
<input class="btn btn-primary radius" type="button" value="&nbsp;&nbsp;返回&nbsp;&nbsp;"> <input class="btn btn-primary radius" type="button" value="&nbsp;&nbsp;返回&nbsp;&nbsp;">
</a> </a>
</div> </div>
</div> </div>
</form> </form>
</article> </article>
<!--_footer 作为公共模版分离出去--> <!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="lib/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript" src="lib/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="lib/layer/2.4/layer.js"></script> <script type="text/javascript" src="lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="static/h-ui/js/H-ui.min.js"></script> <script type="text/javascript" src="static/h-ui/js/H-ui.min.js"></script>
<script type="text/javascript" src="static/h-ui.admin/js/H-ui.admin.js"></script> <!--/_footer 作为公共模版分离出去--> <script type="text/javascript" src="static/h-ui.admin/js/H-ui.admin.js"></script> <!--/_footer 作为公共模版分离出去-->
<!--请在下方写此页面业务相关的脚本--> <!--请在下方写此页面业务相关的脚本这里预留了位置方便添加与该页面特定业务逻辑相关的JavaScript代码比如对表单输入内容进行验证、根据用户操作进行页面动态交互等功能的代码以完善页面的业务功能和用户体验。 -->
<script type="text/javascript" src="lib/My97DatePicker/4.8/WdatePicker.js"></script> <script type="text/javascript" src="lib/My97DatePicker/4.8/WdatePicker.js"></script>
<script type="text/javascript" src="lib/jquery.validation/1.14.0/jquery.validate.js"></script> <script type="text/javascript" src="lib/jquery.validation/1.14.0/jquery.validate.js"></script>
<script type="text/javascript" src="lib/jquery.validation/1.14.0/validate-methods.js"></script> <script type="text/javascript" src="lib/jquery.validation/1.14.0/validate-methods.js"></script>
<script type="text/javascript" src="lib/jquery.validation/1.14.0/messages_zh.js"></script> <script type="text/javascript" src="lib/jquery.validation/1.14.0/messages_zh.js"></script>
<!--/请在上方写此页面业务相关的脚本--> <!--/请在上方写此页面业务相关的脚本-->
</body> </body>
</html>
</html>
Loading…
Cancel
Save