jQueryのタッチイベントがスマホ環境でのみ動作しない

Question

以下コードを用いて、
ボタンをクリックすることで、メニューにopenというクラスをつける処理をjQueryを用いて、行おうとしています。

chrome環境では、動作するのですが、
スマートホン、chromeのエミュレータ上で動作させることができません。

原因がわかる方がいれば、教えて頂きたいです。
よろしくお願いします。

$(function (){
$("#menu_button").bind('click', function() {
$("#g_nav").toggleClass("open");
});
});

Answer 1

id=g_nav 付近のhtmlが見てみたい。。。

Answer 2

とりあえず

$(function (){ 
  $("#menu_button").bind('click', function() { 
     alert('clicked');
  }); 
}); 

など使用して本当にクリックイベントが発動しているか確認してみて下さい。
もしalertが出ないならクリックイベントをsetするときにすでにエラーが起きてます。
その場合タイピングミスがないか、bindというイベントのセットがjqueryのverで対応しているか。（on('click')などではないか）
を確認してみて下さい。

もしalertが出る場合はその中にtoggleClass周辺にエラーがあるので一旦addClassなどにしてちゃんと要素が外れているかを確認してみて下さい！
もし外れているならtoggleClassがエラーだと思います！

頑張ってください！

Answer 3

クリックとtouchは別腹のイベントだったような気がします。
これで上手くいくかな？

MouseEventとtouchEvent
http://blog.fenrir-inc.com/jp/2011/06/ios_android_pc_touchevent.html

$(function (){ 
  $("#menu_button").bind('click touchend', function() { 
    $("#g_nav").toggleClass("open"); 
  }); 
});