关于自适应手机版本下拉菜单的js做法

很多朋友在用cms或者其它系统制作网站，特别是自适应电脑或者手机版网站的时候，经常会遇到一个问题。就是电脑上的导航有没有下拉，主导航都是可以点的。因为电脑的下拉导航都是触碰式下拉，也就是鼠标放上去就会自动下拉，所以不存在点击问题。但是手机不同，手机的页面不存在触碰下拉，所以很多情况下，需要点击主导航，然后伸缩出子导航，但是这时候又会很尴尬，就是没有子导航的就无法进入页面了，所以小编想来想去，可以用js的方法来实现。咱们就吧所有的主导航都放心的加上链接，然后用js来判断是否有子菜单，如果有，就去掉主导航的链接，如果没有，保留主导航链接。
如图


写上两段代码供大家参考

html环境里的代码

1. <div class="xialaph">
   
2.     <ul>
   
3.         <li class="titleTwo clearfix ">
   
4.             <div class="container tp">
   
5.                 <a href="#" target="_self">关于我们<b></b></a>
   
6.             </div>
   
7.             <ul class="ul2">
   
8.                 <div class="container">
   
9.                     <h5 class="xixi"><a href="#" target="_self">公司简介</a></h5>
   
10.                     <h5 class="xixi"><a href="#" target="_self">荣誉资质</a></h5>
    
11.                     <h5 class="xixi"><a href="#" target="_self">厂容厂貌</a></h5>
    
12.                 </div>
    
13.             </ul>
    
14.         </li>
    
15.     </ul>
    
16. </div>

复制代码

js判断语句

1. <script>
   
2.     $('.xialaph .titleTwo').each(function () {
   
3.         if ($(this).find('.xixi').length < 1) {
   
4.             $(this).find('.tp a b').remove();
   
5.         } else {
   
6.             $(this).find('.tp a').attr('href','javascript:;');
   
7.         }
   
8.     })
   
9. </script>

复制代码

仅供参考哦！！！ 有需要建站，仿站，合作外包，或者其它互联网服务的而已加qq36480562，期待与您的合作！