Bind jQuery UI completamento automatico usando .live ()

Ho cercato ovunque, ma non riesco a trovare alcun aiuto …

Ho alcune caselle di testo che vengono create dynamicmente tramite JS, quindi ho bisogno di associare tutte le loro classi a un completamento automatico. Di conseguenza, ho bisogno di usare la nuova opzione .live ().

Ad esempio, per associare tutti gli elementi con una class di .foo ora e futura creata:

$('.foo').live('click', function(){ alert('clicked'); }); 

Ci vuole (e si comporta) lo stesso di .bind (). Tuttavia, voglio associare un completamento automatico …

Questo non funziona:

 $('.foo').live('autocomplete', function(event, ui){ source: 'url.php' // (surpressed other arguments) }); 

Come posso usare .live () per associare il completamento automatico?

AGGIORNARE

Capito con Framer:

 $(function(){ $('.search').live('keyup.autocomplete', function(){ $(this).autocomplete({ source : 'url.php' }); }); }); 

Se invece stai usando jquery.ui.autocomplete.js prova questo

 .bind("keydown.autocomplete") or .live("keydown.autocomplete") 

in caso contrario, utilizzare jquery.ui.autocomplete.js e vedere se funzionerà

Se ciò non si applica, non so come aiutarti a rompere

La funzione di completamento automatico dell’interfaccia utente di jQuery aggiunge automaticamente la class “ui-autocomplete-input” all’elemento. Ti consigliamo di colbind live l’elemento su focus senza la class “ui-autocomplete-input” per impedire la re-binding su ogni evento keydown all’interno di quell’elemento.

 $(".foo:not(.ui-autocomplete-input)").live("focus", function (event) { $(this).autocomplete(options); }); 

modificare

La mia risposta non è più aggiornata da jQuery 1.7, vedere il commento di Nathan Strutz da utilizzare con la nuova syntax .on() .

Per aggiungere, puoi usare il plugin .livequery per questo:

 $('.foo').livequery(function() { // This will fire for each matched element. // It will also fire for any new elements added to the DOM. $(this).autocomplete(options); }); 

Per ottenere il completamento automatico del lavoro quando caricato dynamicmente per l’evento on() utilizzato in jQuery> 1.7, utilizzando la syntax Nathan Strutz fornisce nel suo commento:

 $(document).on('focus', '.my-field:not(.ui-autocomplete-input)', function (e) { $(this).autocomplete(options) }); 

dove .my-field è un selettore per il tuo elemento di input automatico.

.live () non funziona con lo stato attivo. anche keyup.autocmplete non ha alcun senso. Invece la cosa che ho provato a lavorare è questa

  $(document).ready(function(){ $('.search').live('keyup' , function() { $(this).autocomplete({ source : 'url.php' }); }); }) 

Funziona perfettamente.

Non puoi .live () supporta solo eventi JavaScript effettivi, non eventi personalizzati. Questo è un limite fondamentale di come funziona .live ().

Puoi provare a usare questo:

 $('.foo').live('focus.autocomplete', function() { $(this).autocomplete({...}); }); 

Dopo aver letto e verificato le risposte di tutti gli altri, l’ho aggiornato per la versione corrente di JQuery e fatto alcune modifiche.

Il problema con l’utilizzo di keydown come evento che chiama .autocomplete() è che non riesce a completare automaticamente la prima lettera digitata. L’utilizzo della messa a fuoco è la scelta migliore.

Un’altra cosa che ho notato è che tutte le soluzioni date portano a .autocomplete() essere chiamato più volte. Se si aggiunge un elemento dynamicmente alla pagina che non verrà rimosso di nuovo, l’evento dovrebbe essere triggersto una sola volta. Anche se l’elemento deve essere rimosso e aggiunto di nuovo, l’evento deve essere rimosso e quindi aggiunto ogni volta che l’elemento viene rimosso o aggiunto in modo che la messa a fuoco sul campo non richiama inutilmente .autocomplete() ogni volta.

Il mio codice finale è il seguente:

 $(document).on('focus.autocomplete', '#myAutocomplete', function(e){ $(this).autocomplete(autocompleteOptions); $(document).off('focus.autocomplete', '#myAutocomplete'); }); 

il completamento automatico non è un evento, ma una funzione che abilita la funzionalità di completamento automatico per una casella di testo.

Quindi, se è ansible modificare il js che crea le caselle di testo in modo dinamico per avvolgere l’elemento textbox come un object jquery e chiamare il completamento automatico su quell’object.

Ho appena notato che hai modificato il tuo post con questa risposta. Era ovvio per me quindi lo sto postando per gli altri. Grazie.

 $(function() { $('.search').live('keyup.autocomplete', function() { $(this).autocomplete({ source : 'url.php' }); }); }); 

Questo funziona per me:

 $(function() { $('.item_product').live('focus.autocomplete', function() { $(this).autocomplete("/source.php/", { width: 550, matchContains: true, mustMatch: false, selectFirst: false, }); }); }); 

Puoi semplicemente inserire il completamento automatico all’interno dell’evento live di input, in questo modo:

 $('#input-element').live('input', function(){ $("#input-element").autocomplete(options); });