1： 获取事件源的两种方式
2： overflow 控制展现
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'index.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> <script type="text/javascript"> // 第二种通过this对象获取时间源 function list(node){ //alert("""); var dlNode = node.parentNode; var nodes = document.getElementsByTagName("dl"); //alert(nodes.length); for (var i = 0; i < nodes.length; ++i) { if (nodes[i] == dlNode) { if (nodes[i].className == "close") { nodes[i].className = "open"; } else { nodes[i].className = "close"; } } else { nodes[i].className = "close"; } } } /* 第一种通过event获取时间源 function list(){ var node = event.srcElement; var dlNode = node.parentNode; var nodes = document.getElementsByTagName("dl"); //alert(nodes.length); for (var i = 0; i < nodes.length; ++i) { if (nodes[i] == dlNode) { if (nodes[i].className == "close") { nodes[i].className = "open"; } else { nodes[i].className = "close"; } } else { nodes[i].className = "close"; } } } */ </script> <style type="text/css"> .open{ overflow: visible; } .close{ overflow: hidden; } dl{ overflow: hidden; height: 16px; } </style> </head> <body> <dl> <dt onclick="list(this)">会员管理</dt> <dd>添加会员</dd> <dd>删除会员</dd> <dd>查询会员</dd> </dl> <dl> <dt onclick="list(this)">会员管理</dt> <dd>添加会员</dd> <dd>删除会员</dd> <dd>查询会员</dd> </dl> <dl> <dt onclick="list(this)">会员管理</dt> <dd>添加会员</dd> <dd>删除会员</dd> <dd>查询会员</dd> </dl> <dl> <dt onclick="list(this)">会员管理</dt> <dd>添加会员</dd> <dd>删除会员</dd> <dd>查询会员</dd> </dl> <dl> <dt onclick="list(this)">会员管理</dt> <dd>添加会员</dd> <dd>删除会员</dd> <dd>查询会员</dd> </dl> </body> </html>本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
