Комментарии Facebook в ajax загружают аккордеон jQuery-ui, загружают OK только при первом вызове ajax

  1. У меня есть функция, которая загружает аккордеон jquery ui (различные аккордеоны на основе разных идентификаторов)

  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. Я старался:

    • loading the #fb-root and facebook comment <script> on the main layout....doesn't work.
    • добавление FB.XFBML.parse(); в функцию displayFB.... не работает
    • добавление FB.XFBML.parse(); в $(document).ready(function(){} ... не работает.

  6. Спасибо, что читаете и пытаетесь помочь!!

ОБНОВЛЕНИЕ:

  1. Я сделал эту маленькую демонстрацию... Я не могу заставить ее работать... возможно, jsfiddle - не лучшее место для вставки комментариев Facebook: Моя первая скрипка

  2. Возможно, важно сказать, что я использую cakephp на своем сайте...

  3. Пожалуйста, помните, что мой код отлично работает при первом вызове аккордеона и функции displayFb... затем, когда я переключаюсь на другой аккордеон... происходит сбой...

  4. Еще раз спасибо!

ОБНОВЛЕНИЕ 2:

  1. Это еще один вопрос пользователя.... очень похожий на мой. Пожалуйста, обратите внимание, что он не использует аккордеон... но в общем jquery.... может быть, кто-то лучше меня поймет ответ...

jquery ajax accordion facebook-comments
person Shunsho    schedule 02.09.2012    source источник
comment
попробуйте console.log(data) в функции displayFb и проверьте, возвращаются ли данные из API?   -  person Kundan Singh Chouhan    schedule 02.09.2012
comment
Я пытался, он возвращает данные каждый раз... он работает нормально, но не показывает комментарии, только в первый раз. Спасибо.   -  person Shunsho    schedule 02.09.2012
comment
Можете ли вы подготовить демо и предоставить любую ссылку, чтобы я мог понять, в чем должна быть проблема.   -  person Kundan Singh Chouhan    schedule 02.09.2012
comment
Ok. Большое вам спасибо за вашу помощь. Я подготовлю демо как можно скорее, чтобы показать больше информации...   -  person Shunsho    schedule 03.09.2012

Ответы (2)


arrow_upward
0
arrow_downward

Где www.myweb.com/fbcomments/id:

Таким образом, вы фактически добавляете элемент DIV #fb-root и снова и снова загружаете JS SDK и помещаете его в свой документ… что не очень хорошая идея.

Попробуйте загрузить только элемент .fb-comments через AJAX, а затем запустить FB.XFBML.parse для этого нового фрагмента содержимого.

Встраивайте #fb-root и JS SDK на свою страницу с самого начала и только один раз.

person CBroe    schedule 04.09.2012
comment
Я старался. Если я загружаю комментарий facebook «скрипт» в основной макет (и .fb-комментарии через ajax)... не работает. Но если я добавлю #fb-root и facebook ‹script› к тегу ‹body›, когда я запускаю функцию displayFb, это работает. Но у меня все еще есть проблемы с загрузкой второго аккордеона. Каждый раз, когда я нажимаю на новый аккордеон, предваряемый элемент #fb-root загружается без его содержимого (несколько div и iframe со скриптами...), даже если я удаляю() #fb-root... - person Shunsho; 04.09.2012
comment
Может быть, я не понимаю всех основных понятий, и, может быть, то, что я скажу, это безумие... но я думаю, что тег facebook ‹script›, если запустить его один раз, независимо от того, загружен ajax или нет, я не могу вызовите его еще раз и вставьте правильный контент в #fb-root и .fb-комментарии ... есть ли способ принудительно освободить память и снова запустить скрипт facebook? - person Shunsho; 04.09.2012
comment
Вы не должны ничего вставлять в #fb-root самостоятельно, оставьте этот элемент в покое. Загрузите ваш динамический контент, включая элемент .fb-comments, и поместите его в документ, а затем сообщите сценарию FB, что он должен снова запустить синтаксический анализатор XFBML в этой новой части документа. - person CBroe; 04.09.2012
comment
МОЙ БОГ!! работает!! ну.... не на 100% идеально, но работает.... Наконец, я добавляю FB.XFBML.parse() В вызываемый код ajax.... не в основной макет или аккордеон.... - person Shunsho; 04.09.2012
comment
Я не могу решить, как не загружать #fb-root снова и снова... поэтому значок загрузчика facebook остается поверх iframe.... Я не знаю, почему это работает, но загрузчик все еще там. ..в конце концов, искренне благодарю вас за помощь, CBroe и всех вас, ребята....и простите меня за то, что я не пробовал это решение раньше...сейчас это очень очевидно для меня... - person Shunsho; 04.09.2012
comment
Наконец, решение было найдено... Я беру скрипт #fb-root и fb и вставляю сразу после контейнера аккордеона div... Кроме того, на странице, загруженной ajax (/fbcomments/' + id), я помещаю после .fb-comments div, функция FB.XFBML.parse()... СПАСИБО!! работает идеально... - person Shunsho; 05.09.2012

arrow_upward
0
arrow_downward

Вы можете использовать отладчик или скрипач браузера для анализа ответа сервера. Он вполне может содержать ошибку, которую вы не видите, потому что ваш вызов Ajax не обрабатывает ошибки.

Вместо использования $.get() попробуйте использовать $.ajax() и укажите ошибку ( ) функцию обратного вызова, чтобы увидеть, какая ошибка может быть возвращена из вашего вызова 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);
      }
    });
 
person chrisp_68    schedule 02.09.2012
comment
Я сделал то, что вы говорите... измените метод и функцию ошибки.... Он ведет себя так же, как и мое решение: загружать комментарии только для первого выбранного аккордеона (любого из них)... а затем, когда я выбираю другой аккордеон , исчезают и больше не загружаются... - person Shunsho; 02.09.2012
comment
Странная вещь: когда я попробовал console.log для ответа (данные), он показал весь контент, загруженный с www.myweb.com/fbcomments/id .... он выглядит нормально, но не загружает iframe fbcomments. Я думаю, что решение находится на FB.XFBML.parse(); но как? Я тоже пытался.... опять с плохим результатом... - person Shunsho; 02.09.2012
comment
1) Отладьте код displayfb() и убедитесь, что при добавлении ответа в #facecomm Дом изменен и присутствуют новые элементы, возможно, они скрыты. 2) Попробуйте переместить элемент facecomm так, чтобы он не находился в Iframe, просто чтобы проверить, не является ли это причиной проблемы. 3). Я согласен с другими комментариями. Урезанная демонстрация поможет нам помочь вам. Действительно хороший способ сделать это — использовать jsfiddle.net . - person chrisp_68; 03.09.2012
comment
Работает ли displayfb() в контексте I-кадра или хоста? - person chrisp_68; 03.09.2012
comment
Хорошо, я сделал вещь номер 2) и понял следующее: - person Shunsho; 03.09.2012
comment
Когда я вызываю первый аккордеон, а затем вызываю функцию displayFb(), Facecomm загружается идеально. Затем, когда я перехожу на другой аккордеон, facecomm все еще имеет свое содержимое... предыдущая ветка комментариев facebook...поэтому я попытался вызвать функцию displayFB и не изменил facecomm контент .... Затем я попытался добавить $("#facecomm").empty(); в загрузчик аккордеона, но это только решение для очистки Facecomm, но не загружает содержимое Facecomm их соответствующего идентификатора - person Shunsho; 03.09.2012
comment
Можете ли вы опубликовать весь html или, как упомянул другой комментатор, пример сокращения. Похоже, вы отправляете ответ не в тот элемент dom. - person chrisp_68; 03.09.2012
comment
Я не вижу iframe в этом html и не вижу элементов с id=facecomm - person chrisp_68; 04.09.2012
comment
Facecomm создается в функции loadAccordion... Я говорил об iframe, созданном комментариями facebook... именно так Facebook вставляет комментарии... спасибо. - person Shunsho; 05.09.2012