一个jsp模板

最新推荐文章于 2022-12-11 19:40:24 发布
最新推荐文章于 2022-12-11 19:40:24 发布
阅读量402 收藏
点赞数 1
分类专栏： java web开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_30347133/article/details/109912080
版权
web开发 同时被 2 个专栏收录
611 篇文章 2 订阅
订阅专栏
java
574 篇文章 4 订阅
订阅专栏 
<%@page contentType="text/html;charset=UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<base href="${pageContext.request.scheme}://${pageContext.request.serverName}:${pageContext.request.serverPort}${pageContext.request.contextPath}/">
<meta charset="UTF-8">

<link href="jquery/bootstrap_3.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet" />
<link href="jquery/bootstrap-datetimepicker-master/css/bootstrap-datetimepicker.min.css" type="text/css" rel="stylesheet" />

<script type="text/javascript" src="jquery/jquery-1.11.1-min.js"></script>
<script type="text/javascript" src="jquery/bootstrap_3.3.0/js/bootstrap.min.js"></script>
<script type="text/javascript" src="jquery/bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.js"></script>
<script type="text/javascript" src="jquery/bootstrap-datetimepicker-master/locale/bootstrap-datetimepicker.zh-CN.js"></script>

<%-- pagination plugin --%>
<link href="jquery/bs_pagination/jquery.bs_pagination.min.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="jquery/bs_pagination/jquery.bs_pagination.min.js"></script>
<script type="text/javascript" src="jquery/bs_pagination/en.min.js"></script>

<script type="text/javascript">

	$(function(){
		
		$(".time").datetimepicker({
			 language: 'zh-CN',//显示中文
			 format: 'yyyy-mm-dd',//显示格式
			 minView: "month",//设置只显示到月份
			 initialDate: new Date(),//初始化当前日期
			 autoclose: true,//选中自动关闭
			 todayBtn: true,//显示今日按钮
			 clearBtn : true
		});
		
		//定制字段
		$("#definedColumns > li").click(function(e) {
			//防止下拉菜单消失
	        e.stopPropagation();
	    });
		
		$("#createBtn").click(function(){
			// 弹出modal窗口，但是modal窗口上需要所有者下拉列表数据。
			// 发送ajax get请求，查询所有的用户tbl_user
			// 重置表单
			$("#activityForm")[0].reset();
			$.get(
				"workbench/activity/create.do",
				function(json){
					
					// [{"id":"","name":""},{"id":"","name":""},{"id":"","name":""}]
					var html = "";
					$.each(json , function(i , n){
						// n代表的是数组中的每个元素: n.id 和 n.name
						html += "<option value='"+n.id+"'>"+n.name+"</option>";
					});
					$("#owner").html(html);
					// 设置下拉列表的value
					$("#owner").val("${user.id}");
					// 显示modal
					$("#createActivityModal").modal("show");
				}
			);
		});
		
		$("#saveBtn").click(function(){
			// 发送ajax post请求保存市场活动
			$.post(
				"workbench/activity/save.do",
				{
					"owner" : $.trim($("#owner").val()),
					"name" : $.trim($("#name").val()),
					"startDate" : $.trim($("#startDate").val()),
					"endDate" : $.trim($("#endDate").val()),
					"cost" : $.trim($("#cost").val()),
					"description" : $.trim($("#description").val())
				},
				function(json){
					if(json.success){
						// 隐藏modal窗口
						$("#createActivityModal").modal("hide");
						// 显示分页查询的第一页数据
						display(1, 2); 
					}else{
						alert("保存市场活动失败");
					}
				}
			);
		});
		
		// 页面加载完毕之后显示第一页数据
		display(1, 2); // 1表示第一页，2表示每页显示2条。（页面加载完毕之后，每页显示的记录条数先给一个默认值：2）
		
		$("#queryBtn").click(function(){
			// 将页面上的四个查询条件更新到隐藏域当中
			$("#h-name").val($.trim($("#p-name").val()));
			$("#h-owner").val($.trim($("#p-owner").val()));
			$("#h-startDate").val($.trim($("#p-startDate").val()));
			$("#h-endDate").val($.trim($("#p-endDate").val()));
			// 获取当前每页显示的记录条数
			// var pageSize = $("#pagination").bs_pagination('getOption', 'rowsPerPage');
			// display(1, pageSize);
			display(1, $("#pagination").bs_pagination('getOption', 'rowsPerPage'));			
		});
		
		// 全选或者取消全选
		$("#firstChk").click(function(){
			// $(":checkbox") // 页面中所有的复选框对象集合
			// $(":checkbox[name='id']") // 页面中所有name="id"的复选框集合
			$(":checkbox[name='id']").prop("checked" , this.checked); // this是dom对象，有这个checked属性。
		});
		
		// jquery是否支持同时给多个元素绑定事件呢？支持的。
		// 以下代码有问题，给name="id"的复选框绑定事件的时候，复选框还不存在。无法绑定。
		/*
		$(":checkbox[name='id']").click(function(){
			alert(1111);
		});
		*/
		
		// jquery提供了一种机制，可以给页面上后期ajax动态生成的元素绑定事件
		// 专门是给ajax后期动态生成的元素绑定事件：on
		/*
			语法：
				$(父元素选择器).on("事件" , "被绑定事件的元素选择器" , callback);
		
			on 是非常重要的知识点。jquery中的动态元素绑定事件。
		*/
		$("#activityTbody").on("click" , ":checkbox[name='id']" , function(){
			$("#firstChk").prop("checked" , $(":checkbox[name='id']").size() == $(":checkbox[name='id']:checked").size());
		});
		
		// 尽量不要无故扩大范围，范围越大，浏览器执行效率越低。
		/*
		$("body").on("click" , ":checkbox[name='id']" , function(){
			alert(444);
		});
		*/
		
		$("#delBtn").click(function(){
			if($(":checkbox[name='id']:checked").size() == 0){
				alert("选择数据！");
			} else {
				// 提示用户是否删除
				if(window.confirm("真的删除行么？")){
					// 发送ajax post请求删除
					var sendData = "";
					$.each($(":checkbox[name='id']:checked") , function(i , n){
						// n.value就是市场活动id
						// n是dom对象。不是jquery对象
						sendData += "&id=" + n.value;
					});
					sendData = sendData.substr(1);
					$.post(
						"workbench/activity/delete.do",
						sendData,
						function(json){
							$("#firstChk").prop("checked" ,false);
							if(json.success){
								display(1, $("#pagination").bs_pagination('getOption', 'rowsPerPage'));
							}else{
								alert("删除失败！");
							}
						}
					);
				}
			}
		});
		
		$("#popEditModalBtn").click(function(){
			if($(":checkbox[name='id']:checked").size() == 0){
				alert("选择要修改的数据！");
			} else if($(":checkbox[name='id']:checked").size() > 1){
				alert("一次只能修改一条！");
			} else {
				// 发送ajax get请求，提交市场活动的id，查询市场活动。
				$.get(
					"workbench/activity/edit.do",
					{
						"id" : $(":checkbox[name='id']:checked").val(),
						"_" : new Date().getTime()
					},
					function(json){
						// {"activity" : {"id":"","name":"","owner":"","startDate":"","endDate":"","cost":"","description":""} , "userList" : [{"id":"","name":""},{"id":"","name":""}]}
						// 初始化下拉列表
						var html = "";
						$.each(json.userList , function(i , n){
							html += "<option value='"+n.id+"'>"+n.name+"</option>";
						});
						$("#e-owner").html(html);
						// 定位下拉列表的选项
						$("#e-owner").val(json.activity.owner);
						// 设置modal窗口中每一个文本框的值
						$("#e-id").val(json.activity.id);
						$("#e-name").val(json.activity.name);
						$("#e-startDate").val(json.activity.startDate);
						$("#e-endDate").val(json.activity.endDate);
						$("#e-cost").val(json.activity.cost);
						$("#e-description").val(json.activity.description);
						// 显示modal窗口
						$("#editActivityModal").modal("show");
					}
				);
			}
		});
		
		
		$("#updateBtn").click(function(){
			$.post(
				"workbench/activity/update.do",
				{
					"id" : $.trim($("#e-id").val()),
					"owner" : $.trim($("#e-owner").val()),
					"name" : $.trim($("#e-name").val()),
					"startDate" : $.trim($("#e-startDate").val()),
					"endDate" : $.trim($("#e-endDate").val()),
					"cost" : $.trim($("#e-cost").val()),
					"description" : $.trim($("#e-description").val())
				},
				function(json){
					if(json.success){
						$("#editActivityModal").modal("hide");
						// 分页查询
						var pageNo = $("#pagination").bs_pagination('getOption', 'currentPage');
						var pageSize = $("#pagination").bs_pagination('getOption', 'rowsPerPage'); 
						display(pageNo, pageSize);
						// 第一个复选框取消选中
						$("#firstChk").prop("checked" , false);
					}else{
						alert("更新失败！");
					}
				}
			);
		});
		
		// 给id="exportAllBtn"的按钮绑定click
		$("#exportAllBtn").click(function(){
			if (window.confirm("导出全部吗？")) {
				window.location.href = "workbench/activity/exportAll.do";
			}
		});
		
		$("#exportChkBtn").click(function(){
			if($(":checkbox[name='id']:checked").size() == 0){
				alert("请选择要导出的数据！");
			} else {
				if (window.confirm("导出吗？")) {
					var sendData = "";
					$.each($(":checkbox[name='id']:checked") , function(i , n){
						sendData += "&id=" + n.value;
					});
					sendData = sendData.substr(1);
					window.location.href = "workbench/activity/exportChk.do?" + sendData;
				}
			}
		});
		
		$("#importBtn").click(function(){
			// 发送ajax post请求（异步的ajax导入。）
			var formData = new FormData();
			formData.append("myfile", $("#activityFile")[0].files[0]); 
			$.ajax({
				type : "post",
				url : "workbench/activity/import.do",
				contentType: false,  // 注意1 (默认值是：true表示application/x-www-form-urlencoded，false表示multipart/form-data)
				processData: false,  // 注意2 (false表示不会把对象转换成字符串，对象就按照对象的形式提交给服务器。)
				data : formData,     // 注意3
				success : function(json){
					if(json.success){
						$("#importActivityModal").modal("hide");
						display(1, $("#pagination").bs_pagination('getOption', 'rowsPerPage'));
					}else{
						alert("导入失败！");
					}
				}
			});
		});
		
	});
	
	// 分页查询的方法
	function display(pageNo , pageSize){ // pageNo页码，pageSize每页条数
		$.ajax({
			type : "get",
			cache : false,
			url : "workbench/activity/page.do",
			data: {
				"pageNo" : pageNo,
				"pageSize" : pageSize,
				/*
				"name" : $.trim($("#p-name").val()),
				"owner" : $.trim($("#p-owner").val()),
				"startDate" : $.trim($("#p-startDate").val()),
				"endDate" : $.trim($("#p-endDate").val())
				*/
				"name" : $.trim($("#h-name").val()),
				"owner" : $.trim($("#h-owner").val()),
				"startDate" : $.trim($("#h-startDate").val()),
				"endDate" : $.trim($("#h-endDate").val())
			},
			success : function(json){
				$("#firstChk").prop("checked" , false);
				/*
				{
					"total" : 50,
					"dataList" : [{"id":"","name":"","owner":"","startDate":"","endDate":""},{}]
				}
				*/
				var html = "";
				$.each(json.dataList , function(i , n){
					html += '<tr>';
					html += '<td><input type="checkbox" name="id" value="'+n.id+'"/></td>';
					html += '<td><a style="text-decoration: none; cursor: pointer;" οnclick="window.location.href=\'workbench/activity/detail.do?id='+n.id+'\';">'+n.name+'</a></td>';
					html += '<td>'+n.owner+'</td>';
					html += '<td>'+n.startDate+'</td>';
					html += '<td>'+n.endDate+'</td>';
					html += '</tr>';
				});
				$("#activityTbody").html(html);
				
				// 这种方式依赖了代码的顺序，只要该代码顺序改变一下，则会导致绑定失败。
				/*
				$(":checkbox[name='id']").click(function(){
					alert(222);
				});
				*/
				
				// 显示翻页组件
				var total = json.total;
				var totalPages = (total % pageSize == 0 ? total / pageSize : parseInt(total / pageSize) + 1); 
				$("#pagination").bs_pagination({
					currentPage: pageNo,	
					rowsPerPage: pageSize,	
					maxRowsPerPage: 50,	
					totalPages: totalPages,
					totalRows: total,	
					visiblePageLinks: 3,
					showGoToPage: true,
					showRowsPerPage: true,
					showRowsInfo: true,
					onChangePage : function(event , data){
						// 将隐藏域当中的条件更新到页面文本框中
						$("#p-name").val($("#h-name").val());
						$("#p-owner").val($("#h-owner").val());
						$("#p-startDate").val($("#h-startDate").val());
						$("#p-endDate").val($("#h-endDate").val());
						display(data.currentPage , data.rowsPerPage);
					}
				});
			}
		});
	}
	
</script>
</head>
<body>

	<%-- 四个隐藏域来存储查询条件 --%>
	<input type="hidden" id="h-name">
	<input type="hidden" id="h-owner">
	<input type="hidden" id="h-startDate">
	<input type="hidden" id="h-endDate">

	<!-- 创建市场活动的模态窗口 -->
	<div class="modal fade" id="createActivityModal" role="dialog">
		<div class="modal-dialog" role="document" style="width: 85%;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">×</span>
					</button>
					<h4 class="modal-title" id="myModalLabel1">创建市场活动</h4>
				</div>
				<div class="modal-body">
				
					<form id="activityForm" class="form-horizontal" role="form">
					
						<div class="form-group">
							<label for="create-marketActivityOwner" class="col-sm-2 control-label">所有者<span style="font-size: 15px; color: red;">*</span></label>
							<div class="col-sm-10" style="width: 300px;">
								<select class="form-control" id="owner">
								</select>
							</div>
                            <label for="create-marketActivityName" class="col-sm-2 control-label">名称<span style="font-size: 15px; color: red;">*</span></label>
                            <div class="col-sm-10" style="width: 300px;">
                                <input type="text" class="form-control" id="name">
                            </div>
						</div>
						
						<div class="form-group">
							<label for="create-startTime" class="col-sm-2 control-label">开始日期</label>
							<div class="col-sm-10" style="width: 300px;">
								<input type="text" class="form-control time" id="startDate">
							</div>
							<label for="create-endTime" class="col-sm-2 control-label">结束日期</label>
							<div class="col-sm-10" style="width: 300px;">
								<input type="text" class="form-control time" id="endDate">
							</div>
						</div>
                        <div class="form-group">

                            <label for="create-cost" class="col-sm-2 control-label">成本</label>
                            <div class="col-sm-10" style="width: 300px;">
                                <input type="text" class="form-control" id="cost">
                            </div>
                        </div>
						<div class="form-group">
							<label for="create-describe" class="col-sm-2 control-label">描述</label>
							<div class="col-sm-10" style="width: 81%;">
								<textarea class="form-control" rows="3" id="description"></textarea>
							</div>
						</div>
						
					</form>
					
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-primary" id="saveBtn">保存</button>
				</div>
			</div>
		</div>
	</div>
	
	<!-- 修改市场活动的模态窗口 -->
	<div class="modal fade" id="editActivityModal" role="dialog">
		<%-- 隐藏域中放市场活动的id --%>
		<input type="hidden" id="e-id">
		<div class="modal-dialog" role="document" style="width: 85%;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">×</span>
					</button>
					<h4 class="modal-title" id="myModalLabel2">修改市场活动</h4>
				</div>
				<div class="modal-body">
				
					<form class="form-horizontal" role="form">
					
						<div class="form-group">
							<label for="edit-marketActivityOwner" class="col-sm-2 control-label">所有者<span style="font-size: 15px; color: red;">*</span></label>
							<div class="col-sm-10" style="width: 300px;">
								<select class="form-control" id="e-owner">
								</select>
							</div>
                            <label for="edit-marketActivityName" class="col-sm-2 control-label">名称<span style="font-size: 15px; color: red;">*</span></label>
                            <div class="col-sm-10" style="width: 300px;">
                                <input type="text" class="form-control" id="e-name">
                            </div>
						</div>

						<div class="form-group">
							<label for="edit-startTime" class="col-sm-2 control-label">开始日期</label>
							<div class="col-sm-10" style="width: 300px;">
								<input type="text" class="form-control time" id="e-startDate">
							</div>
							<label for="edit-endTime" class="col-sm-2 control-label">结束日期</label>
							<div class="col-sm-10" style="width: 300px;">
								<input type="text" class="form-control time" id="e-endDate">
							</div>
						</div>
						
						<div class="form-group">
							<label for="edit-cost" class="col-sm-2 control-label">成本</label>
							<div class="col-sm-10" style="width: 300px;">
								<input type="text" class="form-control" id="e-cost">
							</div>
						</div>
						
						<div class="form-group">
							<label for="edit-describe" class="col-sm-2 control-label">描述</label>
							<div class="col-sm-10" style="width: 81%;">
								<textarea class="form-control" rows="3" id="e-description"></textarea>
							</div>
						</div>
						
					</form>
					
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-primary" id="updateBtn">更新</button>
				</div>
			</div>
		</div>
	</div>
	
	
	<!-- 导入市场活动的模态窗口 -->
	<div class="modal fade" id="importActivityModal" role="dialog">
		<div class="modal-dialog" role="document" style="width: 85%;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">×</span>
					</button>
					<h4 class="modal-title" id="myModalLabel">导入市场活动</h4>
				</div>
				<div class="modal-body" style="height: 350px;">
					<div style="position: relative;top: 20px; left: 50px;">
						请选择要上传的文件：<small style="color: gray;">[仅支持.xls或.xlsx格式]</small>
					</div>
					<div style="position: relative;top: 40px; left: 50px;">
						<input type="file" id="activityFile">
					</div>
					<div style="position: relative; width: 400px; height: 320px; left: 45% ; top: -40px;" >
						<h3>重要提示</h3>
						<ul>
							<li>给定文件的第一行将视为字段名。</li>
							<li>请确认您的文件大小不超过5MB。</li>
							<li>从XLS/XLSX文件中导入全部重复记录之前都会被忽略。</li>
							<li>复选框值应该是1或者0。</li>
							<li>日期值必须为MM/dd/yyyy格式。任何其它格式的日期都将被忽略。</li>
							<li>日期时间必须符合MM/dd/yyyy hh:mm:ss的格式，其它格式的日期时间将被忽略。</li>
							<li>默认情况下，字符编码是UTF-8 (统一码)，请确保您导入的文件使用的是正确的字符编码方式。</li>
							<li>建议您在导入真实数据之前用测试文件测试文件导入功能。</li>
						</ul>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-primary" id="importBtn">导入</button>
				</div>
			</div>
		</div>
	</div>
	
	<div>
		<div style="position: relative; left: 10px; top: -10px;">
			<div class="page-header">
				<h3>市场活动列表</h3>
			</div>
		</div>
	</div>
	<div style="position: relative; top: -20px; left: 0px; width: 100%; height: 100%;">
		<div style="width: 100%; position: absolute;top: 5px; left: 10px;">
		
			<div class="btn-toolbar" role="toolbar" style="height: 80px;">
				<form class="form-inline" role="form" style="position: relative;top: 8%; left: 5px;">
				  
				  <div class="form-group">
				    <div class="input-group">
				      <div class="input-group-addon">名称</div>
				      <input class="form-control" type="text" id="p-name">
				    </div>
				  </div>
				  
				  <div class="form-group">
				    <div class="input-group">
				      <div class="input-group-addon">所有者</div>
				      <input class="form-control" type="text" id="p-owner">
				    </div>
				  </div>


				  <div class="form-group">
				    <div class="input-group">
				      <div class="input-group-addon">开始日期</div>
					  <input class="form-control time" type="text" id="p-startDate" />
				    </div>
				  </div>
				  <div class="form-group">
				    <div class="input-group">
				      <div class="input-group-addon">结束日期</div>
					  <input class="form-control time" type="text" id="p-endDate">
				    </div>
				  </div>
				  
				  <%-- 一定要将submit修改为button --%>
				  <button type="button" class="btn btn-default" id="queryBtn">查询</button>
				  
				</form>
			</div>
			<div class="btn-toolbar" role="toolbar" style="background-color: #F7F7F7; height: 50px; position: relative;top: 5px;">
				<div class="btn-group" style="position: relative; top: 18%;">
				  <button type="button" class="btn btn-primary" id="createBtn"><span class="glyphicon glyphicon-plus"></span> 创建</button>
				  <button type="button" class="btn btn-default" id="popEditModalBtn"><span class="glyphicon glyphicon-pencil"></span> 修改</button>
				  <button type="button" class="btn btn-danger" id="delBtn"><span class="glyphicon glyphicon-minus"></span> 删除</button>
				</div>
				<div class="btn-group" style="position: relative; top: 18%;">
				  <button type="button" class="btn btn-default" data-toggle="modal" data-target="#importActivityModal"><span class="glyphicon glyphicon-import"></span> 导入</button>
				  <button type="button" class="btn btn-default" id="exportChkBtn"><span class="glyphicon glyphicon-export"></span> 导出选中</button>
				  <button type="button" class="btn btn-default" id="exportAllBtn"><span class="glyphicon glyphicon-export"></span> 导出全部</button>
				</div>
			</div>
			<div style="position: relative;top: 10px;">
				<table class="table table-hover">
					<thead>
						<tr style="color: #B3B3B3;">
							<td><input type="checkbox" id="firstChk"/></td>
							<td>名称</td>
                            <td>所有者</td>
							<td>开始日期</td>
							<td>结束日期</td>
						</tr>
					</thead>
					<tbody id="activityTbody">
						<%--
						<tr class="active">
							<td><input type="checkbox" /></td>
							<td><a style="text-decoration: none; cursor: pointer;" onclick="window.location.href='workbench/activity/detail.jsp';">发传单</a></td>
                            <td>zhangsan</td>
							<td>2020-10-10</td>
							<td>2020-10-20</td>
						</tr>
                        <tr class="active">
                            <td><input type="checkbox" /></td>
                            <td><a style="text-decoration: none; cursor: pointer;" onclick="window.location.href='workbench/activity/detail.jsp';">发传单</a></td>
                            <td>zhangsan</td>
                            <td>2020-10-10</td>
                            <td>2020-10-20</td>
                        </tr>
                         --%>
					</tbody>
				</table>
			</div>
			
			<%-- 翻页组件 --%>
			<div id="pagination"></div>
			
		</div>
		
	</div>
</body>
</html>
武侠㿝卄清
关注
专栏目录
jsp,html 好看的10套模板
09-08
收集了几套jsp和html管理模板，分享一下。
JSP解析（上）
m0_57753335的博客
10-24 872
jsp理解及其应用（上）
黑猴子的家：JavaWeb 之 jsp 常用模板
黑猴子的博客
12-13 624
1、Index.jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ page import="com.alex.web.entity.BaseUser"%> <%String basePath = request.g...
java jsp网页模板_JSP网页模板
weixin_29801195的博客
02-26 2006
【实例简介】JSP做的一些分页处理 样式精美 提供给大家学习【实例截图】【核心代码】YiBei└── YiBei├── src│ └── com│ └── lbl│ ├── biz│ │ ├── MsgBiz.java│ │ ├── PageBiz.java│ │ ├── Question...
记录一些比较常用的简单jsp模板
qq_43392759的博客
07-08 4395
记录一些比较常用的简单jsp模板 文章目录记录一些比较常用的简单jsp模板一：登录二：显示信息三：添加信息 一：登录 <%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>登录页面</title> </head> <body> <form name="frmlogin" met
JSP网页模板JSP网页模板JSP网页模板
09-18
JSP网页模板则是预先设计好的页面布局，开发者可以基于这些模板快速构建网站前端页面，节省时间和提高效率。 在JSP网页模板中，通常包括以下几个核心组成部分： 1. **HTML结构**：这是模板的基础，定义了页面的...
jsp页面模板
03-18
**JSP页面模板详解** JSP（JavaServer Pages）是一种基于Java的技术，用于创建动态网页...理解并熟练运用JSP模板技术，是每个Web开发者必备的技能之一。通过不断学习和实践，你可以创造出更加高效、易维护的网页应用。
JSP网页模板
10-01
JSP做的一些分页处理 样式精美 提供给大家学习 JSP做的一些分页处理 样式精美 提供给大家学习 JSP做的一些分页处理 样式精美 提供给大家学习 JSP做的一些分页处理 样式精美 提供给大家学习
管理系统 jsp 页面模板 （干净实用） 有js
12-13
这个标题表明我们讨论的是一个基于JSP技术的管理系统的页面模板，其中包含了JavaScript（js）进行前端验证。JSP（JavaServer Pages）是Java平台上的一种服务器端脚本语言，用于创建动态网页。它允许开发者将HTML、...
在JSP页面中输出字符" * "组成的金字塔
a771454823的博客
06-22 2630
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/...
优秀的jsp、html网页设计模板（80多款优秀网页设计模板）
04-15
80多款网页设计模板打包，类容丰富，设计独到，很好的网页设计模板经典实用
漂亮的jsp页面
12-28
漂亮的电子商务网站，可以用作网站制作模板。
各种漂亮的HTML模板
04-23
各种漂亮的HTML模板，可以改为JSP页面
jsp文本框小技巧、特效
07-07
jsp文本框的一些小技巧，帮助你的文本框变靓。
根据模板及表元数据生成jsp列表页
bingliang514csdn的博客
12-11 143
根据模板及表元数据生成jsp列表页
JSP表格模板升级（3）-- 可变列数的表格模板
NearEast的专栏
12-05 3599
前文《JSP表格模板升级（1）-- 用Java反射动态指定方法和参数》已经实现了动态指定具体的业务方法，达到了一定的复用性，但现实使用中，一个仅有两列的列表是无法满足大多数显示要求的，于是本文对表格模板进行了改造，实现了一种列数可变的动态表格模板。         首先是数据结构的变化。由于表格从两列的Key-Value的形式变为可变列，所以数据结构应变为一对多的关系。为简单起见，笔者定义了一
用JSP创建一个表格模板
热门推荐
NearEast的专栏
11-28 1万+
项目中要用到一些展示信息的表格，表头不固定，表格内容是即时从后台取的；考虑到复用性，笔者用jsp编写了一个表格模板，可以从request中获取List封装的数据，然后通过JSTL结合EL表达式填充到模板。最后完成的jsp文件可以作为一个单独的模块，嵌入到任意其它jsp页面需要的位置。           首先是规划一下表格的样式：         为简单起见，此处使用html的table等标
myeclipse创建一个JSP页面
最新发布
05-26
下面是在 MyEclipse 中创建一个 JSP 页面的步骤： 1. 打开 MyEclipse，右键单击项目，选择 New > JSP File。 2. 在弹出的对话框中，输入文件名和所在目录，点击 Next。 3. 选择 JSP 模板，点击 Next。 4. 在 JSP...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值