jquery show hideモバイルで作業していません

Question

私は自分のサイトのモバイルフレンドリーなバージョンを設計していますが、すべてうまくいくようですが、clickの後に表示されるdiv内のリンクをクリックすることはできません。 DOMの読み込みが完了する前にあなたのイベントが割り当てられて取得される可能性があります

<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

：ここ

$(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です。あなたはこのようになります速記そのうち、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'); 
    }); 
});