jquery - Facebook评论到ajax加载的jQuery-ui手风琴，仅在第一次ajax调用时加载OK

Question

1. 我有一个加载 jquery ui 手风琴的功能（基于不同 id 的不同手风琴）

2. 当我点击标题为“Facebook 评论”的标签时，我会：

   $("#myaccordion").bind('accordionchange', function(event, ui) {
       id = $("#myaccordion").data('id');
       switch (ui.newHeader.text()) {
           case "Facebook Comments":
               displayFb(id);
               break;
       }
   });
   

3. “displayFB”功能是：

   function displayFb(id){
       $.get('/fbcomments/' + id, function(data) {
           $("#facecomm").append(data);
           });
       }
   

   www.myweb.com/fbcomments/id 在哪里：

   <div id="fb-root"></div>
   <script>(function(d, s, id) {
       var js, fjs = d.getElementsByTagName(s)[0];
       if (d.getElementById(id)) return;
       js = d.createElement(s); js.id = id;
       js.src = "//connect.facebook.net/es_ES/all.js#xfbml=1";
       fjs.parentNode.insertBefore(js, fjs);
       }(document, 'script', 'facebook-jssdk'));</script>
   <div class="fb-comments" data-href="<?php echo '/fbcomments/'.$id ?>" data-num-posts="10" data-width="220"></div>
   

4. 当我加载主页，然后选择手风琴，然后打开 Facebook 评论时，它完美运行。如果我重新加载页面并选择另一个手风琴，再次完美工作。问题是当我再次选择另一个手风琴或相同的手风琴而不重新加载整个页面时。手风琴加载得很好，上面的所有数据（图像、文本、视频等的一些标签），但没有出现 facebook 评论。

5. 我试过了：

   • 在主布局上加载#fb-root和 facebook 评论<script>....不起作用。
   • 添加FB.XFBML.parse();到 displayFB 功能....不起作用
   • 添加FB.XFBML.parse();到$(document).ready(function(){}...不起作用。

6. 感谢您阅读并尝试提供帮助！

更新：

7. 我做了这个小演示......我无法让它工作......也许 jsfiddle 不是插入 Facebook 评论的最佳位置：我的第一个小提琴

8. 也许重要的是说我在我的网站上使用 cakephp ......

9. 请记住，我的代码在第一次手风琴调用和 displayFb 函数时运行良好……然后当我更改为其他手风琴时……它崩溃了……

10. 再次感谢你！！

更新2：

11. 这是用户的另一个问题....与我的非常相似。请注意，他没有使用手风琴……但 jquery 是共同的……也许有人比我更能理解答案……

Answer 1

您可以使用浏览器调试器或提琴手来分析来自服务器的响应。它很可能包含您没有看到的错误，因为您的 Ajax 调用不处理错误。

而不是使用 $.get() 尝试使用$.ajax()并提供一个 error() 回调函数来查看您的 Ajax 调用可能会返回什么错误。像这样的东西。（未测试）

您可能需要设置数据类型：

    jQuery.ajax({
      type: "GET",
      url: "/fbcomments/"+id,
      success: function (response) {
        // Append the data here into the dom
      },
      error: function (xhr, ajaxOptions, thrownError) {
        alert(xhr.status);
        alert(thrownError);
      }
    });
  

Answer 2

www.myweb.com/fbcomments/id 在哪里：

因此，您实际上是在有效地添加 DIV 元素#fb-root并一遍又一遍地加载 JS SDK 并将其放置在您的文档中……这不是一个好主意。

尝试通过 AJAX仅加载元素，然后在该新内容上运行。.fb-commentsFB.XFBML.parse

从一开始就将 JS SDK嵌入#fb-root到您的页面中，并且仅一次。