11
Probé con el evento 'tap' móvil de jquery y encontré que disparó dos veces, cada vez que se activa. Código de la siguiente manera para una página HTML:evento de jQuery móvil tap activado por dos veces
<!DOCTYPE html>
<html>
<head>
<title>Demo</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.js"></script>
<style>
#box{
background-color:red;
width:200px;
height:200px;
}
</style>
</head>
<body>
<div id="box">
tapped me
</div>
<script type="text/javascript">
$(document).ready(function() {
$('#box').bind('tap',function(event) {
alert('why');
});
});
</script>
</body>
</html>
Más irónico es cuando pruebo esto una jsFiddle, sólo se activa el evento de una sola vez .
Aquí está el enlace. http://jsfiddle.net/mochatony/tzQ6D/6/
Después de más pruebas descubrí que el error se ha ido con la colocación de la sección javascript en el encabezado.
<!DOCTYPE html>
<html>
<head>
<title>Demo</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
</script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.js">
</script>
<style type="text/css">
#box{ background-color:red; width:200px; height:200px; }
</style>
<script type="text/javascript">
$(document).ready(function() {
$('#box').bind('tap', function(event) {
alert('halo');
});
});
</script>
</head>
<body>
<div id="box">
tapped me
</div>
</body>
</html>
No pude explicar por qué la ubicación en el cuerpo y la sección del encabezado hacen que esto sea diferente.
Gracias por la respuesta. Hizo una prueba con pageinit, el evento pageinit también se disparó dos veces. Pruebo tanto en Firefox como en Chrome. Me parece extraño. – TonyTakeshi