jQuery: creare selettori personalizzati

jQuery: creare selettori personalizzati

In jQuery i selettori personalizzati (custom) iniziano tutti con il prefisso : e si ottengono aggiungendo un metodo all'oggetto $.expr(). Questo metodo ha tra i suoi parametri l'elemento jQuery da selezionare. Vediamone insieme i dettagli.

L'elemento jQuery non fa parte di un normale set jQuery ma è un elemento DOM. Occorre quindi utilizzare il wrapper $() per poter utilizzare su di esso i metodi di jQuery.

Il metodo definito, che è una funzione, deve necessariamente restituire un valore booleano che indica se la selezione ha avuto successo o meno o, in altre parole, se l'elemento o gli elementi selezionati soddisfano la condizione richiesta.

Proviamo a definire un selettore che selezioni solo gli elementi flottati:


$.extend($.expr[':'], {
    floats: function(element) {
        return $(element).css('float') !== 'none';
    }
});

Proviamo quindi a testare il nostro selettore:


$('#select').click(function() {
    $(':floats', '#test').addClass('test');
});​

Torna su