A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© 刘张朋 中级黑马   /  2013-7-11 21:08  /  987 人查看  /  0 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

本帖最后由 刘张朋 于 2013-7-14 22:33 编辑

如下面的代码,我的运行结果跟毕老师视频上不一样,不知是不是浏览器的问题,还有就是我的这个点浏览器的时候演示一在ie和火狐上都不能展开,但是在搜狗上却可以,搞不懂啊。。。。。

                      我的运行结果                                                                                     老师运行结果

                                          

  1. <P> </P>
复制代码
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5. <title>Insert title here</title>

  6. <script type="text/javascript">

  7. function openClose(){
  8. var node = event.srcElement;
  9. var dlNode = node.parentNode;

  10. var divNode = document.getElementById("divId");
  11. var dlNodes = divNode.getElementsByTagName("dl");

  12. for(var x=0;x<dlNodes.length;x++){

  13. if(dlNodes[x]==dlNode){
  14. if(dlNode.className=="open")
  15. dlNode.className = "close";
  16. else
  17. dlNode.className = "open";
  18. }
  19. else
  20. dlNodes[x].className = "close";
  21. }
  22. }

  23. </script>
  24. <style type="text/css">

  25. .open{
  26. overflow:visible;
  27. }
  28. .close{
  29. overflow:hidden;
  30. }
  31. dl{
  32. height:16px;
  33. overflow:hidden;
  34. }

  35. </style>

  36. </head>
  37. <body>

  38. <div id="divId">
  39. <dl>
  40. <dt onclick="openClose()">演示一</dt>
  41. <dd>冰川时代刚</dd>
  42. <dd>冰川时代刚</dd>
  43. <dd>冰川时代刚</dd>
  44. <dd>冰川时代刚</dd>
  45. </dl>
  46. <dl>
  47. <dt onclick="openClose()">演示二</dt>
  48. <dd>冰川时代刚</dd>
  49. <dd>冰川时代刚</dd>
  50. <dd>冰川时代刚</dd>
  51. <dd>冰川时代刚</dd>
  52. </dl>
  53. <dl>
  54. <dt onclick="openClose()">演示三</dt>
  55. <dd>冰川时代刚</dd>
  56. <dd>冰川时代刚</dd>
  57. <dd>冰川时代刚</dd>
  58. <dd>冰川时代刚</dd>
  59. </dl>
  60. </div>

  61. </body>
  62. </html>
复制代码

0 个回复

您需要登录后才可以回帖 登录 | 加入黑马