jQuery – Conseguir el valor href de un enlace

Para conseguir el valor de href en un enlace con jQuery utilizaremos el siguiente código: 1 2 3 4 5 6 7 $(document).ready(function() { $("a").click(function(event) { var href = $(‘a’).attr(‘href’); alert(href); event.preventDefault(); }); });$(document).ready(function() { $("a").click(function(event) { var href = $(‘a’).attr(‘href’); alert(href); event.preventDefault(); }); }); Como podéis ver, a todos los enlaces del web, miramos el valor de href y lo mostramos en un alert. Pero, podemos contretar un poco mas: 1 2 3 4 5 $(".zonalink").click(function(event) { var href= […]

» Read more

Asignar acción en jquery a múltiples enlaces

En muchas ocasiones nos interesa que al clicar sobre los enlaces de un apartado, el que sea, se ejecute una acción determinada. Pongamos un ejemplo: Tengo un submenú en la parte izquierda con varios enlaces. Al clicar sobre alguno de ellos, queremos que muestre una ventana modal. Tenemos dos opciones, o aplicamos uno a uno la acción a realizar sobre cada enlace o: Asignamos a todos los enlaces que nos interese una clase, en nuestro ejemplo .linkaccion 1 2 3 […]

» Read more

jquery bootstrap TypeError: $(…) is null

Que título mas raro para un post. Pues bien, detrás de él hay uno de los problemas que nos podemos encontrar al trabajar con jQuery y Bootstrap a la vez. Pongo un ejemplo que me pasó para que lo entendáis mejor: Objetivo: hacer una ventana modal con bootstrap y que se abra automáticamente. El código de la ventana modal en bootstrap 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 <!– […]

» Read more

jQuery deshabilitar un elemento de formulario

Siguiendo con algunos ejemplos de casos prácticos de jQuery, os muestro de una manera sencilla cómo deshabilitar elementos de un formulario web. 1 2 3 4 5 <form action="paginadestino.php" method="post"> <label for="nombre">Nombre</label> <input type="text" id="nombre" name="nombre" value="Nombre ejemplo" /> <input type="submit" value="enviar" /> </form><form action="paginadestino.php" method="post"> <label for="nombre">Nombre</label> <input type="text" id="nombre" name="nombre" value="Nombre ejemplo" /> <input type="submit" value="enviar" /> </form> Si nos interesa por algún motivo deshabilitar el campo ‘nombre’, con jQuery simplemente deberemos cambiarle el atributo del elemento de […]

» Read more

jQuery – Crear botón imágenes que cambian

Veamos el código necesario para crear un enlace en forma de imagen, que al pasar el botón por encima (hover) cambia a otra imagen. Un ejemplo sería tener una imagen en modo escala de grises y que al pasar por encima, la imagen se mostrara a color: Meterial necesario Tendremos dos imágenes boton-off.png y boton-on.png en la carpeta ‘/images/’. El off será a escala de grises, y el off es la misma imagen pero a color. boton-off.png: será la imagen […]

» Read more

jQuery Plugin MiniJS Notification – Muestra mensajes en tu web (aviso cookies)

jquery tutorial

Os facilito un enlace a un magnífico plugin que os facilitará la tarea de poner mensajes en vuestra web o aplicación. Un ejemplo claro, sería la obligación de la nueva ley a informar a nuestros usuarios sobre la utilización de cookies. Pues bien, con este plugin de jQuery podremos personalizar cómo y dónde mostrar el mensaje. Compartir…Twitter0LinkedinFacebook0Google+0DiggBufferTumblr0Print

» Read more

jQuery Plugin Tutorial – Layout

jQuery

Vídeo-tutorial dónde explicamos brevemente cómo utilizar el plugin Layout para jQuery. Nos permite dividir la pantalla de una aplicación para hacerla mas usable permitiendo esconder o mostrar la información. Descarga el código Descargar código ejemplo Compartir…Twitter0LinkedinFacebook0Google+0DiggBufferTumblr0Print

» Read more

Ejemplo AJAX envío formulario con jQuery

Pequeño ejemplo de utilización de AJAX para el envío de un formulario Página del formulario (pw-pac1.html) En el header <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script> <script type="text/javascript"> function validarUsuario(){ pnom= $(’#nom’).val(); ppass= $(’#pass’).val();   $.ajax({ type: ‘POST’, url: ‘./pw-pac1.php’, data: { nom: pnom, pass: ppass } }).done(function( msg ) { $("#consola").html(msg); }).fail(function (jqXHR, textStatus, errorThrown){ $("#consola").html("The following error occured: "+ textStatus +" "+ errorThrown); }); } </script><script type="text/javascript" src="js/jquery-1.9.1.min.js"></script> <script type="text/javascript"> function validarUsuario(){ pnom= $(‘#nom’).val(); ppass= $(‘#pass’).val(); $.ajax({ type: ‘POST’, url: ‘./pw-pac1.php’, data: […]

» Read more

jQuery 2.0 no da soporte a Internet Explorer 6,7 y 8

Las últimas noticias indican que la nueva versión de jQuery, no dará soporte a Internet Explorer 6,7 y 8. Un duro golpe a Microsoft, y a los usuarios que utilizan estas versiones de navegador. En cuanto a los desarrolladores, deberemos escoger entre la versión 1.9.1 que da soporte a IE 6,7 y 8 o la nueva versión. jQuery 2.0 es totalmente compatible con la anterior, pero adelgaza un 12% debido a este ‘no soporte de versiones de Internet explorer’. Al […]

» Read more

jQuery – Validar formulario antes de enviarlo

Os dejamos un videotutorial que detalla cómo validar un formulario antes de enviarlo, mostrando al usuario qué error está cometiendo y en que campo. Validator, el primer plugin de jquery que vemos. Todos los videotutoriales de jQuery Compartir…Twitter0LinkedinFacebook0Google+0DiggBufferTumblr0Print

» Read more

jQuery UI – Tutorial 3 – Widget Date Picker

Breve tutorial que se muestra cómo utilizar el widget Date Picker de la librería jQuery UI. Un widget que facilita al usuario insertar una fecha en un formulario. Al clicar sobre el campo, se muestra un calendario para escoger el día. Iremos mirando alguno de los widgets más interesantes. Más información Todos nuestros tutoriales de jQuery jQuery UI Web Compartir…Twitter0LinkedinFacebook0Google+0DiggBufferTumblr0Print

» Read more
1 2 3 4