Jquery on touchstart não funciona no browser mobile, mas funciona no browser pra desk

Front-end
, , ,
#1

Olá pessoal,

Eu tenho um código em jquery que carrega uma página sempre que um botão é clicado, mas eu não consigo fazer com que ele funcione no browser do Mobile, embora no browser desktop esteja funcionando perfeitamente.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.js"></script>
<script type="text/javascript">
/* Jquery Load */
        $(document).ready(function() {
            $('ul#nav li a').on('touchstart click', (function() {
                var page = $(this).attr('href');
                $('#lesson').load('ar101/' + page + '.php');
                return false;
            }));
        });
/* End of Jquery Load */
</script>
#2

Se é “sempre que um botão é clicado”, porque não usa o evento click normal? Tem o mesmo funcionamento no toque normal do touch.

$( "#target" ).click(function() {
  alert( "Handler for .click() called." );
});
#3

Tentei fazer o que você sugeriu, troquei pra um evento click normal que em teoria tem o mesmo funcionamento do toque normal do touch, mas ainda assim não funcionou.

To testando pelo developer tools na função de Mobile, com ctrl+shift+M.

	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
	<script src="https://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.js"></script>
	<script type="text/javascript">
	/* Jquery Load */
			$(document).ready(function() {
  				$('ul#nav li a').click(function() {
					var page = $(this).attr('href');
					$('#lesson').load('ar101/' + page + '.php');
					return false;
  				});
			});
	/* End of Jquery Load */
	</script>