InstantClick bindet nicht an dynamische href

Question

Ich verwende derzeit http://instantclick.io, aber das Plugin bindet meine dynamisch erstellten Links nicht ein.

PHP Antwort

$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>' 
); 

handler jQuery Form

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

Commander.init in der Antwort liest, und die Antwort würde oben führen die Funktion innerhalb alert()dm.commander

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

}, 

Wie Sie können sehen, die PHP-Antwort sendet eine Warnung mit einem Link darin. Die Form verarbeitet sie dann und gibt alert(), die ein div prepends

Und die jQuery #messages die

bindet, ist

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

Die oben genannten Arbeiten mit normalen Links, die bereits auf der Seite sind aber es doesn‘ t arbeiten mit dem Link, den PHP erzeugt und jQuery vorgibt.

Obwohl ich nicht spezifisch zu #messages aufgrund anderer Funktionen in Zukunft delegieren kann, könnte anfügen, um #content zu sagen.

Gibt es sowieso zu binden Instant-Link zu dynamisch erstellten Links wie oben.

Und ja, ich habe recherchiert und konnte keine Antwort finden, die funktioniert.

Answer 1

Sie initialisieren InstantClick nur beim Laden der Seite. Es wird dann auf alle Links angewendet, die sich momentan in der DOM-Struktur befinden. Wenn Sie der DOM-Struktur neue Links hinzufügen, werden diese nicht automatisch dem InstantClick hinzugefügt. Versuchen Sie, das InstantClick am Ende der AJAX-Warnmeldung zu initialisieren.

Nachdem ich NoGray's Antwort gelesen habe, denke ich, dass du von .one zu .on wechseln willst. Das muss auch neu initialisiert werden:

Ich muss zugeben, das fühlt sich ein bisschen dreckig an. Ich initialisiere es einfach neu, aber ich konnte keine Dokumentation über irgendwelche Zerstörungs- oder Reinit-Funktionen finden. Das ist meine beste Schätzung.

Der ursprüngliche Boden Code festgelegt:

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

Answer 2

tatsächlich für dynamisch erstellte DOM Elemente, die Sie benötigen auf zu verwenden, statt ein.

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

dank