2014-07-24 12 views
7

Attualmente sto usando http://instantclick.io, tuttavia il plug-in non lega i miei collegamenti creati dinamicamente.InstantClick non vincolante a href dinamico

Risposta PHP

$json['alert'] = array(
     'type'  => 'success', 
     'content' => 'Success! Your new thread has been posted, you can visit  it <a href="' . site_url_in . 'forums/thread/' . $id . '">here</a>' 
); 

gestore di moduli jQuery

$.post(url, form, function(data){ 
      //Lets do awesomeness 
      console.log('Data: ' + data); 
      console.log('Form: ' + form); 
      dm.commander.init(data); 
     }); 

Commander.init legge nella risposta, e la risposta di cui sopra sarebbe eseguire la funzione alert() entro dm.commander

alert: function(message) 
{ 
    $("#messages").empty(); 
    $("#messages").prepend('<div class="alert alert-'+message['type']+'">'+message['content']+'</div>'); 
//  this.scrollTo('messages'); 

}, 

Come puoi vedere la risposta di PHP invia un avviso con un link in esso. Il modulo poi lo elabora e restituisce alert(), che antepone un div per #messages

E il jQuery che lega è

$(document).one('click', 'a', function(e) { 
     console.log('clicked'); 
     e.preventDefault(); 
    }) 
    InstantClick.init(100); 

Le opere di cui sopra con i collegamenti normali che sono già sulla pagina tuttavia esso doesn' t lavorare con il link che PHP genera e jQuery si prepara.

Anche se non è possibile delegare in modo specifico a #messages a causa di altre funzioni in futuro, è possibile aggiungere a #content.

C'è comunque un modo per associare instantclick a collegamenti creati dinamicamente come sopra.

E sì, ho ricercato e non ho trovato una risposta che funzionasse.

+0

stai chiamando instantclick dopo quelle funzioni? – NathanG

+0

Instantclick è l'ultima cosa da avviare, ho anche provato a reinizializzare dopo il processo del modulo senza alcun risultato – Ian

+0

Strano, questa è l'unica cosa che riesco a pensare in questo momento. – NathanG

risposta

4

Si sta inizializzando solo il caricamento di InstantClick sulla pagina. Si applicherà quindi su tutti i link attualmente presenti nell'albero DOM. Quindi, quando aggiungi nuovi collegamenti all'albero DOM, questi non vengono aggiunti automaticamente a InstantClick. Prova a inizializzare l'InstantClick alla fine della funzione di avviso AJAX.

Dopo aver letto la risposta di NoGray, penso che vogliate passare da .one a .on. Inoltre, questo deve essere reiniziato anche:

Devo ammettere che questo si sente un po 'sporco. Basta inizializzarlo di nuovo, ma non sono riuscito a trovare alcuna documentazione su una sorta di distruggere o ripristinare le funzioni. Quindi questa è la mia ipotesi migliore.

Il codice fondo originale fisso:

$(document).on('click', 'a', function(e) { 
    console.log('clicked'); 
    e.preventDefault(); 
}); 
InstantClick.init(100); 
+0

cliccato viene visualizzato ora nel log della console, ma dopo ciò non accade nulla. – Ian

+0

Dato che stai facendo 'e.preventDefault();' e non ho usato InstantClick da solo, presumo che InstantClick supponga di attivare il collegamento precaricato al clic? – Niklas

2

in realtà per elementi DOM creati dinamicamente è necessario utilizzare su invece di uno.

$(document).off("click",'a').on('click', 'a', function(e) { 
    console.log('clicked'); 
    e.preventDefault(); 
}); 

grazie

Problemi correlati