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/fbcmets/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 cmets 没有出现。

5. 我试过了：

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

6. 感谢您的阅读并尽力提供帮助！

更新：

1. 我做了这个小演示......我无法让它工作......也许 jsfiddle 不是插入 Facebook 评论的最佳位置：My First Fiddle

2. 说我在我的网站上使用 cakephp 可能很重要...

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

4. 再次感谢您！！

更新 2：

11. This is another question 的用户....与我的非常相似。请注意，他没有使用手风琴...但是 jquery 是共同的...也许有人比我更能理解答案...

Answer 1

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

尝试使用$.ajax() 而不是使用$.get() 并提供一个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/fbcmets/id 在哪里：

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

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

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