Aggiungere la funzione jQuery per elementi specifici

Question

So che è possibile aggiungere nuove funzioni di jQuery per $.fn.someFunction = function()

Tuttavia, voglio aggiungere funzioni al solo elementi specifici. Ho provato questa sintassi e non funziona $('.someElements').fn.someFunction = function()

che voglio fare questo in modo che io possa chiamare la funzione come questa in qualche parte del codice di $('someElements').someFunction();

Answer 1

Usa .bind() e .trigger()

$('button').bind('someFunction',function() { 
    alert('go away!') 
}); 


$('button').click(function(){ 
    $(this).trigger('someFunction'); 
}); 

Come di jQuery 1.7, il metodo .on() è il preferito metodo per che associa i gestori di eventi all'annuncio DOCUMENTO.

Answer 2

ho avuto un'idea che ho pensato che potrebbe lavorare per fare vicino a quello che vuoi, ma non ha funzionato, e la mia conclusione è che questo non è possibile.

La mia idea era quella di fare quello che aveva provato, ma su un oggetto jQuery in cache, per esempio:

var a = $("a"); 
a.fn.someFunc = function() {...}; 
a.someFunc();

Ma poiché $(...).fn non esiste, che non è possibile.

Answer 3

yo può fare quanto sopra con questo:

$.fn.testFn = function(){ 
    this.each(function(){ 
     var className = $(this).attr('class'); 
     $(this).html(className); 
    });  
}; 

$('li').testFn(); //or any element you want 

prova: http://jsfiddle.net/DarkThrone/nUzJN/

Answer 4

Non sono sicuro anche con la mia risposta se questo ti aiuterà ma solo una prova su come utilizzare .live?

$(selector).live(click,function(){ 
    //some codes here 
}); 

Answer 5

Yo, necessario per fare la stessa cosa, è venuto con questo. è bello perché distruggi l'elemento e la funzione va giù! Penso che ...

var snippet=jQuery(".myElement"); 
snippet.data('destructor', function(){ 
    //do something 
}); 
snippet.data('destructor')(); 

Answer 6

@ La risposta di Reigel è eccezionale! Tuttavia si potrebbe anche utilizzare la sintassi $.fn e lasciate che la vostra funzione gestire solo alcuni elementi:

$.fn.someFunction = function(){ 
    this.each(function(){ 
     // only handle "someElement" 
     if (false == $(this).hasClass("someElement")) { 
      return; // do nothing 
     } 

     $(this).append(" some element has been modified"); 

     return $(this); // support chaining 
    });  
}; 

// now you can call your function like this 
$('.someElement').someFunction();    

Vedi jsfiddle di lavoro: http://jsfiddle.net/AKnKj/3/

Answer 7

in realtà ho avuto questo caso d'uso pure, ma con un oggetto in cache. Quindi avevo già un oggetto jQuery, un menu di attivazione/disattivazione e volevo collegare due funzioni a quell'oggetto, "aperto" e "chiuso". Le funzioni necessarie per preservare l'ambito dell'elemento stesso e così era, quindi volevo che this fosse l'oggetto del menu. Ad ogni modo, puoi semplicemente aggiungere funzioni e variabili tutte a piacere, proprio come qualsiasi altro oggetto javascript. A volte me lo dimentico.

var $menu = $('#menu'); 
$menu.open = function(){ 
    this.css('left', 0); 
    this.is_open = true; // you can also set arbitrary values on the object 
}; 
$menu.close = function(){ 
    this.css('left', '-100%'); 
    this.is_open = false; 
}; 

$menu.close(); 

Answer 8

Ho fatto questo e funziona bene ..

function do_write(){ 
    $("#script").append("<script> $(\'#t"+(id_app+4)+"\').change(function(){ alert('Write Your Code here'); });<\/script>"); 
    console.log("<script> $(\'#t"+(id_app+4)+"\').change(function(){ alert('hello'); });<\/script>"); 
} 

e la funzione di chiamata dalla funzione dinamica che sta creando un controllo dinamico in html

Answer 9

Se hai intenzione questa funzione solo per particolari selettori, di seguito lavorerà per voi. Ho appena avuto uno scenario in cui ho avuto bisogno di questo e funziona bene.

$('.my-selector').each(function(){ 

    $(this).init.prototype.getUrl = function(){ 
     // do things 
    }; 
}) 

poi in seguito si può fare

$('.my-selector').getUrl() 

senza dover definire come un plug-in, o utilizzare i dati o si legano/su eventi/trigger.

Ovviamente è possibile modificare la funzione per restituire l'oggetto che contiene, se si desidera utilizzarlo in concatenamento restituendo this

$('.my-selector').each(function(){ 

    $(this).init.prototype.getUrl = function(){ 
     // do things 
     return this; 
    }; 
}) 

Answer 10

La soluzione più ovvia è quella di assegnare una funzione come proprietà dell'oggetto:

obj.prop("myFunc", function() { 
    return (function(arg) { 
    alert("It works! " + arg); 
    }); 
}); 

Poi chiamano sull'oggetto in questo modo:

obj.prop("myFunc")("Cool!"); 

Nota: la tua funzione è il valore di ritorno di quello esterno, vedi: http://api.jquery.com/prop/#prop-propertyName-function