写两个相同内容的DIV，巧妙实现表单模块的状态，在可编辑和不可编辑之间切换

最新推荐文章于 2024-04-29 14:57:44 发布

Lenux2017

最新推荐文章于 2024-04-29 14:57:44 发布

阅读量2k

点赞数 1

分类专栏： jsp 文章标签：切换div 展示隐藏div

本文链接：https://blog.csdn.net/Lenux2017/article/details/78429466

版权

简单来说，两个相同的div，一个带文本框，一个不带文本框。点击时触发切换操作，隐藏其中一个，展示另外一个。

通过dom对象的display属性的none/block切换是否显示

<%@ 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/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<jsp:include page="/base.jsp"></jsp:include>
<script type="text/javascript" src="<%=request.getContextPath()%>/js/uploadify/jquery.uploadify.min.js"></script>
<link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/js/uploadify/uploadify.css" />
</head>
<body>
    <div>
        【基本人员信息】
     </div>
  
  <div id="buttons">
      <a id="btn" οnclick="updatabj()" class="easyui-linkbutton" data-options="iconCls:'icon-search'">修改</a> 
       <a id="btn" οnclick="showupdatabj()" class="easyui-linkbutton" data-options="iconCls:'icon-search'">显示维护</a> 
        <a id="btn" οnclick="" class="easyui-linkbutton" data-options="iconCls:'icon-search'">查看人员信息</a> 
         <a id="btn" οnclick="out2Execle()" class="easyui-linkbutton" data-options="iconCls:'icon-save'">导出execle到F盘根目录</a> 
  </div>

 <div id="hide">
    <table id="shua">
		<tr>
			<td align="right">
				<label style="color: blue;font-size: small;">职务编号: </label>
			</td>
			<td>	
				${jbxx.cBh}
			</td>
			<td align="right">
				<label style="color: blue;font-size: small;">头像: </label>
			</td>
			<td>
        		<input type = "file" name = "file_upload" id = "upload"/>        
        		<img id = "img" src="" style = "width:50px; height:50px;"/>          
				
			</td>
		</tr>
		<tr>
			<td align="right">
				<label style="color: blue;font-size: small;">姓名: </label>
			</td>
			<td>
				${jbxx.cName}
			</td>
				<td align="right">
				<label style="color: blue;font-size: small;">曾用名: </label>
			</td>
			<td>
				${jbxx.cCym}
			</td>
		</tr>
		<tr>
			<td align="right">
				<label style="color: blue;font-size: small;">性别: </label>
			</td>
			<td>
				 ${jbxx.cXb==0?"女":""} 
				 ${jbxx.cXb==1?"男":""} 
			</td>
				<td align="right">
				<label style="color: blue;font-size: small;">民族: </label>
			</td>
			<td>
				${jbxx.cMz}
			</td>
		</tr>
		<tr>
			<td align&#

最低0.47元/天解锁文章

Lenux2017

关注

1
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
写两个相同内容的DIV，巧妙实现表单模块的状态，在可编辑和不可编辑之间切换

简单来说，两个相同的div，一个带文本框，一个不带文本框。点击时触发切换操作，隐藏其中一个，展示另外一个。通过dom对象的display属性的none/block切换是否显示<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>Insert title her
复制链接

扫一扫