Trucos Jquery

[sasuke.17]

Evitar conflictos entre librerías

Existe la posibilidad de que en una misma web se estén utilizando diferentes frameworks de javascript. Esto puede provocar conflictos entre ellos. Para el caso de jQuery se puede evitar asignando el método a otra variable diferente al dólar:

Código PHP:

var $j = jQuery.noConflict();
$j(‘#myDiv’).hide(); 


Comprobar que jQuery está cargado

Antes de llamar a nuestro desarrollo conviene comprobar que jQuery se ha cargado correctamente. Para ello podemos usar cualquiera de estas dos opciones:

Código PHP:

    /* Metodo 1 */
    if (jQuery) {
    // jQuery esta cargado
    } else {
    // jQuery no esta cargado
    }

    /* Metodo 2 */
    if (typeof jQuery == ‘undefined’) {
    // jQuery no esta cargado
    } else {
    // jQuery esta cargado
    } 


Mejorar la selección de elementos

Al buscar en el DOM por los elementos siempre conviene realizarlo en base al ID del mismo en vez de la clase (aunque en las nuevas versiones de la librería se haya optimizado mucho).

Código PHP:

/* ID */
$(“#myid”).html();
/* es mas rapido que */
$(“.myclass”).html(); 


Y en caso de seleccionar por clase, siempre es mejor idicando el tipo de elemento:

Código PHP:

$(“ul.myclass”);
/* es mas rapido que */
$(“.myclass”); 


Obtener el total de elementos seleccionados

Al realizar una selección de elementos como la que comentábamos anteriormente puede que nos interese saber el número de elementos que se han visto afectados. Para ello podemos usar la siguiente función:

Código PHP:

$(‘.someClass’).length; 


Obtener jQuery de los servidores de Google

Cargar la librería desde los servidores de Google ofrece unas ventajas muy interesantes. Para integrarlo en nuestro proyecto tenemos dos opciones, una más estandar y otra más eficiente:

Código PHP:

    <script src=&#8221;http://www.google.com/jsapi”></script>
    <script type=&#8221;text/javascript”>
    google.load(&#8220;jquery”, “1.2.6″);
    google.setOnLoadCallback(function() {
    //Code to be inserted in this area
    });
    </script> 


Código PHP:

    /* la mejor forma */
    <script type=&#8221;text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js”></script>
    <script type=&#8221;text/javascript”>
    $(document).ready(function() {
    //This is more like it!
    });
    </script> 


Comprobar que una checkbox está marcada

Tenemos tres formas de realizar esta comprobación:

Código PHP:

     // Primera
    $(‘#checkBox’).attr(‘checked’);
    // Segunda
    $(‘#edit-checkbox-id’).is(‘:checked’);
    // Tercera
    $(“[:checkbox]:checked”).each(
    function() { … }
    ); 


Convertir el elemento LI completamente en el enlace

Solemos basarnos en el elemento UL para realizar nuestros menús. En ocasiones, el area del LI es superior a la del enlace que contiene, por lo que el elemento no es funcional 100%. Para evitarlo podemos hacer lo siguiente:

Código PHP:

$(“ul li”).click(function(){
// se obtiene la url del enlace que contiene y se lanza
window.location=$(this).find(“a”).attr(“href”); return false;
}); 


Obtener las coordenadas X e Y del cursor del ratón

Código PHP:

$().mousemove(function(e){
//muestra las coordenadas X e Y en un parrafo
$(‘p’).html(“X Axis : ” + e.pageX + ” | Y Axis ” + e.pageY);
}); 


Como activar y descativar un elemento con jQuery

Código PHP:

 // Para desactivar
 $(‘.someElement’).attr(‘disabled’, ‘disabled’);

 // Para activar
 $(‘.someElement’).removeAttr(‘disabled’);
 // O puedes asignar el attr a “”
 $(‘.someElement’).attr(‘disabled’, ”); 


Desactivar las animaciones de jQuery

Esta instrucción deshabilitará todas las animaciones de la librería:

Código PHP:

jQuery.fx.off = true; 


[Felina05]

[cramercaba]

[kecks]

[carmen10]

Gracias por compartir
Feliz Navidad

[wpiaw]

[VJEVans]

Gracias por el aporte compañero