Touch event not working on touch screen laptop

Question

I have put simple code for touch event and its working fine in mobile devices but does not working in the touch screen laptop.

$(document).ready(function(){
    $(".navigation a").bind("touchstart",function(e){
      alert('Touch start!');
    });
});

Answer 1

Maybe is listening mouse events. You can add a variable for your event, and check if its capabilities can reproduce touch events or not. You can use modernizr javascript library to get more accuracy in this task.

http://modernizr.com/

Let me show you an example:

 var clickEvent = undefined;
 if (Modernizr.touch) { 
      clickEvent = "touchstart";
 } else {
      clickEvent = "click";
 }
 $(document).ready(function(){
    $(".navigation a").bind(clickEvent,function(e){
       alert('It works!')
    });
 });

Answer 2

Update: Check out the jQuery Pointer Events Polyfill project which allows you to bind to "pointer" events instead of choosing between mouse & touch. https://github.com/jquery/PEP

Bind to both, but make a flag so the function only fires once per 100ms or so.

var flag = false;
 $thing.bind('touchstart click', function(){
  if (!flag) {
    flag = true;
   setTimeout(function(){ flag = false; }, 100);
// do something
  }

  return false
});