Ich habe eine große Seite mit einer Schaltfläche "Mehr laden" am unteren Rand; Jeder Klick auf "Mehr laden" lädt mehr Inhalte über AJAX. Ein Teil dieses Inhalts ist Facebook wie Schaltflächen:
%Vor% Nachdem ich den zusätzlichen Inhalt geladen habe, kann ich Facebook bitten, die gesamte Seite mit FB.XFBML.parse(); erneut zu analysieren (was dazu führt, dass diese divs zu tatsächlichen Schaltflächen werden). Dies funktioniert perfekt, allerdings wird es sofort langsam, da Facebook den Inhalt, der bereits auf der Seite war, erneut analysiert, nicht nur den neuen Inhalt. Jedes Mal, wenn der Benutzer auf "Mehr laden" klickt, wird die gesamte Seite analysiert, so dass es mehr und mehr für die FB-Funktion gibt.
Hier nun die gute Nachricht: Die Dokumentation für die Analyse-Methode des FB sagt:
... um nur einen Teil eines Dokuments auszuwerten, können Sie einen einzelnen übergeben Element.
FB.XFBML.parse(document.getElementById('foo'));
Also dachte ich, okay, wenn der Nutzer auf "Mehr laden" klickt, werde ich das frische HTML in ein einzigartiges div einbinden, dann jQuery benutzen, um durch div zu gehen, alle Facebook-Tags zu finden und fragen Facebook, um nur diese zu analysieren. Gute Idee, oder? Aber es funktioniert nicht. Der Code scheint die Elemente nach dem Laden an Facebook zu übergeben, aber sie analysieren nicht. Code:
Es gibt keine Fehlermeldung, es werden nur keine Ergebnisse erzeugt. Der Debug-Code auf der Konsole sieht perfekt aus, es findet die richtigen Elemente.
UPDATE Spielen Sie damit bei diesem einfachen Spiel: Ссылка
UPDATE 2 Ich habe auch versucht, den Code von HTML5 in FBML zu ändern ( click " Get Code "auf dieser Seite , um den Unterschied zu sehen, der nicht nur das gleiche Ergebnis hatte, sondern jetzt auch nur eine zusätzliche Schaltfläche im Ajax-Aufruf statt zwei lädt. So wurde es noch schlimmer! Sie können mit der FBML-Version hier spielen: Ссылка
Die Dokumentation gibt an, dass das dom-Element root DOM node, defaults to body sein sollte. Also ersetze ich .each Funktionsaufruf durch einen einzelnen Aufruf einer .parse -Methode mit dem erzeugten DOM-Element. Hier ist ein jsfiddle .
Hinweis: FB.XFBML.parse () sollte auf einem übergeordneten Element des Widgets aufgerufen werden, nicht direkt auf dem XFBML-Element selbst.
In meinem Fall würde die akzeptierte Lösung nicht funktionieren, weil die FB-Posts im selben DOM-Container angehängt sind.
Was ich getan habe, ist eine FB.XFBML.parse () in den Container zu laufen, eine .each-Schleife zu verwenden und removeClass den fb-post, füge class facebook-post-loaded hinzu. Bei nachfolgenden Ajax-Aufrufen und Abrufen neuer fb-Posts würde die FB.XFBML.parse () die bereits geladenen Elemente nicht mehr auswählen, da sie die fb-post-Klasse nicht mehr besitzen.