touchevent event function inside jQuery document

Question

I have the following event function inside jQuery document ready function:

    $(document).ready(function() {

        function touchStart( e ) {
             var targetEvent =  e.touches.item(0);
             var y = targetEvent.clientY;
             var x = targetEvent.clientX;

             $('.display').text("X Y:"+x+" "+y);

             e.preventDefault();
             return false;
        }



    });

It works if I place it outside the $(document).ready but not inside it.. why?

If I want to use some jQuery on touchStart what would be the way to do it?

Answer 1

You probably want something like:

$(document).ready(function() {

   $(document).bind('touchstart',
    function( e ) {
         var targetEvent =  e.touches.item(0);
         var y = targetEvent.clientY;
         var x = targetEvent.clientX;

         $('.display').text("X Y:"+x+" "+y);

         e.preventDefault();
         return false;
    });
});