Este es una extensión del tutorial de Ajax usando Javascript, pero en esta ocasión será usando jQuery, el código es bastante más simple que con JavaScript, pero siempre se van a manejar las 2 funciones que mencioné en el otro tutorial, la que «inicia» el proceso y la que ejecuta una «acción» cuando recibe los datos
Aquí el código Ajax usando jQuery
<html> <head> <title>Ejemplo de manejo de Ajax usando jquery</title> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script type="text/JavaScript"> function consultar(valor) { $("#resultado").html("Cargando..."); //Mostramos el mensaje de cargando $.get("meses.php",{num:valor},procesarEventos); //enviamos la solicitud usando el método get e indicando los parámetros :valor, y por ultimo la función que se ejecutará cuando lleguen los datos } function procesarEventos(datos) { $("#resultado").html(datos); //cuando los datos lleguen lo mostramos dentro del control con el id resultado } </script> </head> <body> <input type="text" id="valor" name="valor"> <input type="button" value="Consultar" onclick="javascript: consultar(valor.value);"> <div id="resultado"></div> </body> </html>
como ven, el código es mucho más sencillo con jQuery, lo pueden verificar aqui: http://www.elcodigofuente.com/ejemplos/jquery_ajax.php y descargar el ejemplo como siempre
Excelente trabajo hermano, gracias por brindar sus conocimientos a los que estamos aprendiendo.
algo así pero con conexión a base de datos sería excelente