Выполнить кнопку "like" после вызова ajax

был несколько вопросов, похожих на мои в стеке, но никто не ответил на мой вопрос, поэтому...

Ajax-вызов возвращает стандартный html-код для создания подобной кнопки:

<div class="fb-like" data-href="#" onclick="location.href='http://www.website.com'; return false;" data-send="true" data-width="450" data-show-faces="true"></div>

Этот html появляется в источнике при просмотре с помощью элемента проверки, но он не отображается, т.е. пространство, в котором должна быть кнопка, пуста. Есть ли какая-то функция рендеринга, которую я должен использовать?

Любые подсказки будут очень благодарны!

EDIT: здесь запрос ajax и синтаксический анализ - кнопка "как" помещается в "#thequestion" вместе с другим текстом (это отражается на question.php).

$("#thequestion").load("/thought/question.php", { ans: choice, id: questionId } );
    $("#graph").load("/thought/graph.php", { id: questionId } );
    $("#fbCommentsPlaceholder").html("<div class='fb-comments' data-href='http://qanai.com/thought/#" + questionId + "' data-num-posts='2' data-width='470'></div>");
    FB.XFBML.parse();
    eval(document.getElementById('thequestion').innerHTML);
    eval(document.getElementById('graph').innerHTML);

(Я знаю, что eval - зло)

РЕДАКТИРОВАТЬ 2: Кнопка типа like появляется, если FB.XFBML.parse(); выполняется вручную (в консоли) после вызова ajax. Благодаря

Ответы

Ответ 1

Вам нужно позвонить FB.XFBML.parse(); после вызова ajax.

Документация: https://developers.facebook.com/docs/reference/javascript/FB.XFBML.parse/

Изменить: теперь я вижу, что вы пытаетесь загрузить содержимое в $('#thequestion'). .load выполняет обратный вызов, который запускается после завершения запроса. Вы должны сделать что-то вроде:

$('#thequestion').load('/my/url', { my: 'params' }, function() {
    FB.XFBML.parse();
});

Документация: http://api.jquery.com/load/

Ответ 2

Не уверен, что кому-то это нужно, но мой полный код выглядит так и теперь делает и страницу FB, и кнопку Like подходящей (кнопка LikeLink, созданная с помощью значка материала):

<i id="LikeLink" class="material-icons actionButton">&#xE8DC;</i>

var fbloaded = false; // if SDK is loaded, no need to do it again (though cache should do this?
var fbpageid = "myPageId"; // FB page id

// ajax call to FB SDK script
if (!fbloaded) {
    $.ajax({
        type: "GET",
        url: "//connect.facebook.net/en_US/sdk.js",
        dataType: "script",
        cache: true,
        success: function () {
            fbloaded = true;
            FB.init({
                appId: '{myAppId}',
                version: 'v2.3' // or v2.0, v2.1, v2.0
            });
// parse button after success
            FB.XFBML.parse();
        }
    });
}

var FBDivAppended = false; // if already done, do not call and render again
PostUrl = window.location.href; // like button needs this... or not :)

// when LikeLink is clicked, add the divs needed and at the end fire the FB script ajax call (resetFB)

$("#LikeLink").click(function () {
if (!FBDivAppended) {
            var $pagediv = $("<div class=\"fb-page\" data-href=\"https://www.facebook.com/" + fbpageid + "\" />");
            var $fblikediv = $("<div class=\"fb-like\" data-href=\"" + PostUrl + "\" />");
            var $fbdiv = $("<div id=\"fbDiv\" />");
            var $fbroot = $("<div id=\"fb-root\" />");
            $fbdiv.append($pagediv).append($fblikediv);
            $(".Header").append($fbdiv).append($fbroot);
            FBDivAppended = true;
        }

resetFB();
}