jquery show hide不能在移動工作

Question

我正在設計我的網站的移動友好版本和一切似乎工作正常，但我不能點擊在單擊功能顯示該div後顯示的div內的鏈接。

$(document).ready(function() { 

document.addEventListener("touchstart", function() {},false); 



$("#business").click(function(){ 
    $(this).addClass('on'); 
    $("#business_open").show(); 
    $("#menu_open").hide(); 
}); 

$("#menu").click(function(){ 
    $(this).addClass('on'); 
    $("#menu_open").show(); 
    $("#business_open").hide(); 
}); 

}); 

這裏是HTML：

<div class="wrapper"></div> 

<div id="business"> 
    <span>Title</span> 
</div> 

    <div id="business_open"> 
    <ul> 
     <li><a href="link1.html">Link 1</a></li> 
     <li><a href="link2.html">Link 2</a></li> 
    </ul> 
    </div> 

<div id="menu"> 
    <em>m</em> 
</div> 

    <div id="menu_open"> 
    <ul> 
     <li><a class="selected" href="link1.html">Link 1</a></li> 
     <li><a href="link2.html">Link 2</a></li> 

    </ul> 
    </div> 

Answer 1

您的活動可能在DOM完成加載之前得到分配。讓您可以通過在一個jQuery準備功能包裹其中，速記這看起來是這樣的：

$(function(){ 
    $("#business").click(function(){ 
     $(this).addClass('on'); 
     $(".wrapper, #business_open").show(); 
     $("#menu_open").hide(); 
    }); 

    $("#menu").click(function(){ 
     $(this).addClass('on'); 
     $(".wrapper, #menu_open").show(); 
     $("#business_open").hide(); 
    }); 

    $(".wrapper").click(function(){ 
     $(".wrapper, #business_open, #menu_open").hide(); 
     $('#business, #menu').removeClass('on'); 
    }); 
});