Curso de jQuery | Ejemplo básico

Por 9.99€ al mes tendrás acceso completo a todos los cursos. Sin matrícula ni permanencia.

Llamada a función I

<script type="text/javascript" src="jquery.js"></script>
<script>
	$(document).ready(inicializar);

	function inicializar(){
		alert("hola");
	}
</script>

$(document) espera a que el código de la página esté cargado, si quiero esperar a que además las imágenes de la página estén cargadas usaré $(window) en su lugar.

Llamada a función II

<script type="text/javascript" src="jquery.js"></script>
<script>
	$(document).ready(inicializar);

	function inicializar(){
		$("#boton").on('click', botonPulsado);
	}

	function botonPulsado(){
		alert("Boton pulsado");
	}
</script>

<input type="button" id="boton"/>

Llamada a función III

<script>
	$(document).ready(inicializar);

	function inicializar(){
		$("#boton").on('click', function(){
			alert("Boton pulsado");
		});
	}
</script>

<input type="button" id="boton"/>

Llamada a función IV

<script>
	$(inicializar);

	function inicializar(){
		$("#boton").on('click', function(){
			alert("Boton pulsado");
		});
	}
</script>

<input type="button" id="boton"/>

Acerca de la función click

A veces esta función se llama dos veces en lugar de una. Esto suele ocurrir cuando genero la página dinámicamente y el evento click se añade varias veces. Para prevenirlo:ç

$(".button").off('click').on('click', function(){
	alert('has hecho click');
});

Es como si una persona tuviese muchas orejas y cada vez que alguien le da los buenos días, saludase una vez por cada oreja que tiene. Si sólo queremos que salude una vez, deberíamos dejarla con sólo una oreja.

Por 9.99€ al mes tendrás acceso completo a todos los cursos. Sin matrícula ni permanencia.