四层树状数据展示,无样式

来源:互联网 发布:update mysql 编辑:程序博客网 时间:2024/06/04 19:19
<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><script src="jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script></head><style type="text/css">ul{list-style: none;}.two{display: none;}.three{display: none;}.four{display: none;}</style><body><div><ul><p class="one">第一层</p><li class="two"><ul><p class="two2">第二层</p><li  class="three"><ul><p class="three2">第三层</p><li  class="four"><ul>     <li>第四层</li>      <li>第四层</li>       <li>第四层</li></ul></li><p class="three2">第三层</p><li  class="four"><ul>     <li>第四层</li>      <li>第四层</li>       <li>第四层</li></ul></li></ul></li></ul></div></body><script type="text/javascript">$(".one").click(function(){console.log(1)if($(this).next().css('display') == 'none'){$(this).next().show()}else{$(this).next().hide()}})$(".two2").click(function(){console.log(1)if($(this).next().css('display') == 'none'){$(this).next().show()}else{$(this).next().hide()}})$(".three2").click(function(){console.log(1)if($(this).next().css('display') == 'none'){$(this).next().show()}else{$(this).next().hide()}})</script></html>

原创粉丝点击