Un segundo enlace de ejemplo en jQuery

No se qué te estarán pareciendo estas lecciones de jQuery... espero que todo esté clarito. Si no es así avísame con un mensaje en el foro CCTW, oki? He creado una sección dedicada al jQuery en él. E intento explicarlo mejor. En cualquier caso, creo que es sencillo. Poco a poco se irá complicando un pelín más, pero a la vez, conforme hagamos más ejemplos, te irás familiarizando seguro con este nuevo lenguaje y podrás ver acciones mucho más interesantes que las que hemos visto hasta ahora.

Como ejercicio para reforzar lo aprendido, vamos a diseñar una ventana con un mensaje distinto para el enlace de arriba, oki? En esta ocasión dirigirá al usuario al foro. Para eso tenemos primero que colocarle la ruta al enlace en el código Html, además de colocarle la clase "forocctw" a esa línea de código:

<p>En el <a class="forocctw" href="http://www.comocreartuweb.com/consultas">foro de CCTW</a> espero que me expliquen un montón de trucos estos webmasters del universo.</p>

Ahora tenemos que añadir la acción que queremos en el archivo funciones.js, quedando el codigo del script así:

$(document).ready(function()
    {

    $(".cctw").click(function(evento)
        {
        alert("Te diriges a una gran página, CCTW!");
        });

    $(".forocctw").click(function(evento)
        {
        alert("Te diriges al foro de CCTW!");
        });

    });

Date cuenta de que niguna de esas dos acciones se va a realizar hasta que todo el codigo Html se haya cargado, pues ambas acciones están entre los corchetes que recogen lo que debe esperar a que el document (la página web) esté ready (cargada completamente).

Si quisieramos que currieran más cosas al hacer clic en uno u otro enlace, bastaría con añadirlo entre los corchetes del script de una u otra de las acciones definidas en el archivo funciones.js

Comparte este artículo en tu red Twitter Comparte este artículo en tu red Facebook Comparte este artículo en tu red Google Enviar '' a Meneame.net