ajax 호출 후 'like' 버튼 렌더링

ajax 호출 후 'like' 버튼 렌더링

나와 비슷한 질문이 몇 개 있었지만 내 질문에 대답한 것은 하나도 없었으므로...

ajax 호출은 다음과 같은 버튼을 만들기 위한 표준 html 코드를 반환합니다.

<div class="fb-like" data-href="http://www.website.com" data-send="true" data-width="450" data-show-faces="true"></div>

이 html은 'inspect element'로 볼 때 소스에 표시되지만 렌더링되지 않아 버튼이 있어야 하는 공간이 비어 있습니다.제가 사용해야 할 렌더링 기능이 있나요?

어떤 힌트라도 주시면 대단히 감사하겠습니다!

편집: 여기 ajax 요청 및 구문 분석이 있습니다. 'like' 버튼은 다른 텍스트와 함께 '#the question'에 입력됩니다(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);

(평가가 사악하다는 걸 알아요)

편집 2: 다음과 같은 경우 좋아요 버튼이 나타납니다.FB.XFBML.parse();는 (콘솔에서) ajax 호출 후 수동으로 실행됩니다.감사해요.

전화를 해야합니다.FB.XFBML.parse();아약스 호출 후에

문서: 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/

필요한 사람이 있는지는 모르겠지만, 지금 내 전체 코드는 이렇게 생겼고 FB 페이지와 좋아요 버튼을 적절히 렌더링합니다. (재료 아이콘으로 만든 좋아요 링크 버튼):

<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();
}

언급URL : https://stackoverflow.com/questions/8961567/render-like-button-after-ajax-call