Hola a todos/as,
Estoy teniendo un problema al usar la última versión de jquery (1.10.2) y jquery mobile (1.3.2) y no se muy bien si es por algo que estoy haciendo mal.
Tengo un archivo html de ejemplo muy sencillo como el siguiente:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="js/jquery_mobile-1.3.2.min.js"></script>
</head>
<body>
<div id="loginPage" data-role="page">
<div data-role="header" data-position="fixed"><h1>AppName</h1></div>
<div data-role="content">
<label for="usernameTextBox">Username</label>
<input id="usernameTextBox" type="text" autocomplete="false" /><br />
<label for="passwordTextBox">Password</label>
<input id="passwordTextBox" type="password" /><br />
<div class="ui-grid-a"><div class="ui-block-a">
<a href="#" id="loginButton" data-role="button" class="dd-btn-a" onclick="return loginButton_Click();">Login</a></div>
</div>
</div>
</div>
<script type="text/javascript" src="js/prueba.js"></script>
</body>
</html>
Y un archivo javascript "prueba.js" muy sencillo como el siguiente:
$(function () {
alert("hola");
$("#loginPage").on("pagecreate", function () {
alert("Dentro");
});
});
Lo que quiero en este ejemplo tan sencillo es que al cargar la página me salten dos alertas, "Hola" y "Dentro". Como tengo el código javascript anterior no me sale ninguna alerta.
Si modifico el fichero "prueba.js" y lo dejo de la siguiente manera:
$("#loginPage").on("pagecreate", function () {
alert("Dentro");
});
Entonces si me sale la alerta "Dentro".
Yo tenía puesto en la primera versión del script "prueba.js" la parte de :
$(function () {
});
porque entendía que de esta manera controlaba que la alerta sólo saldría cuando el DOM estuviera ya listo y cargado en memoria. Pero si no lo quito no consigo que me salga la alerta "Dentro".
Y por otro lado, dejándo el script como lo expuesto en el segundo caso, he visto que si accedo directamente a mi archivo html anterior se me muestra la alerta pero si estoy en otra página html y al pinchar en un enlace me lleva a la página html que os he mostrado anteriormente , entonces no me sale la alerta. ¿a que se puede deber eso?
Gracias.
PD: He tenido que poner la referencia a mi script "prueba.js" antes de la etiqueta </body> porque cuando la pongo antes de la etiqueta </head> la alerta tampoco se me muestra. No se si es el lugar adecuado de colocar el script.
Saludos.