选中单选按钮后显示其他表单元素

纸上得来终觉浅,看了JSP的范例宝典,还是决定把书本的例子操作一遍才安心。

今天在老是把none写成nono,结果老是隐藏不了。

 style="display: none";

本实例主要利用javascript设置表格的display样式来实现表格的显示和隐藏。将表格的display样式设置为none,可以控制表格的隐藏,将表格的display样式设置为block,

可以显示表格。

View Code
 1 <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
 2 <%
 3 String path = request.getContextPath();
 4 String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
 5 %>
 6 
 7 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
 8 <html>
 9   <head>
10     <base href="<%=basePath%>">
11     
12     <title>选中单选按钮后显示其他表单元素</title>
13     
14     <meta http-equiv="pragma" content="no-cache">
15     <meta http-equiv="cache-control" content="no-cache">
16     <meta http-equiv="expires" content="0">    
17     <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
18     <meta http-equiv="description" content="This is my page">
19     <!--
20     <link rel="stylesheet" type="text/css" href="styles.css">
21     -->
22 
23   </head>
24   
25   <body>
26   <input name="user" type="radio" onClick="im1.style.display='block';im2.style.display ='none';" value="0" checked>普通用户
27   <input type="radio" name="user" value="1" onClick="im2.style.display ='block';im1.style.display ='none';">超级用户
28  <table width="448" border="0" id="im1" style="display:nono">
29         <tr>
30           <td>
31             <input name="shenhe" type="checkbox" id="shenhe2" value="1">
32       批示功能</td>
33           <td>
34             <input name="huiyi" type="checkbox" id="huiyi2" value="1">
35       会议管理</td>
36           <td>
37             <input name="gonggong" type="checkbox" id="gonggong2" value="1">
38       公共信息管理 </td>
39           <td>
40             <input name="geren" type="checkbox" id="geren2" value="1">
41       审核个人登记活动 </td>
42         </tr>
43       </table>
44       <table  style="display: none" id="im2">
45           <tr>
46               <td>  <input name="geren" type="checkbox" id="geren2" value="1">超级管理员权限</td>
47           </tr>
48       </table>
49    <table> 
50     <tr bgcolor="#F3F3F3">
51       <td height="23" colspan="6"><div align="center">
52         <input type="submit" name="Submit" value="提交">  
53         <input type="reset" name="Submit2" value="重置">
54       </div></td>
55     </tr>
56   </table>
57   <div style= "display:none "> ok </div> 
58   
59   </body>
60 </html>

 

转载于:https://www.cnblogs.com/zhengchubin/archive/2012/10/08/2715857.html

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值