jQuery .html Facebook埋め込み

divの内容を変更するためにjQueryを使用しようとしています。私は.html関数を見つけました。jQuery .html Facebook埋め込み

これは、Facebookのから埋め込みコードです：

<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/de_DE/sdk.js#xfbml=1&version=v2.8&appId=1281569608559738"; 
     fjs.parentNode.insertBefore(js, fjs); 
    }(document, 'script', 'facebook-jssdk')); 
</script>

そして、これは私がそれを表示したいのdivに入る必要のあるコードです：

<div class="fb-post" data-href="////LINK///" data-show-text="true"> 
          <blockquote cite="////LINK///" class="fb-xfbml-parse-ignore"> 
         </div>

だから私はこのウェブサイトの使用：http://www.accessify.com/tools-and-wizards/developer-tools/html-javascript-convertor/

はこれにコードを変更するには：

var strVar=""; 
strVar += "<div class=\"fb-post\" data-href=\""+ link + "" data-show-text=\"true\">"; 
strVar += "        <blockquote cite=\""+ link + "" class=\"fb-xfbml-parse-ignore\">"; 
strVar += "       <\/div>";

リンクは可変です。以降、私はこのように.htmlを使用します。

$("#iFramePlace").html(strVar);

しかし、何も起こりません。そして私は理由を理解できません。

全体コード：

<html> 
<head> 

    <script src="jquery.js" type="text/javascript" charset="utf-8"></script> 
    <script> 
     $(function() { 

        function ApiRequest(l) { 
         $.get("apiServer/?l=" + l, function(data) { 
           var ServerResult = JSON.parse(data); 
           if (ServerResult.error == false) { 
            if (ServerResult.platform == 'fb') { 
             if (ServerResult.typ == 'fanpage') { 
              var output = ""; 
              output += "<div class=\"fb-post\" data-href=\"" + ServerResult.embedLink + "\" data-show- text=\"true\">"; 
              output += "        <blockquote cite=\"" + ServerResult.embedLink + "\" class=\"fb-xfbml-parse-ignore\">"; 
              output += "       <\/div>"; 
              $("#iFramePlace").html(output); 
             } 
            } else { 
             alert("Mit dem Link stimmt etwas nicht !") 
            } 
           }); 
         } 
         $("#btnForm").click(function() { 
          var link = $("#link").val(); 
          if (link !== "") 
           ApiRequest(link); 
          else 
           alert("LINK FEHLT"); 
         }); 

         console.log("ready!"); 
        }); 
    </script> 
</head> 

<body> 
    <input type="text" id="link" name="inputText" /> 
    <input type="submit" id="btnForm" name="SubmitButton" /> 
    <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/de_DE/sdk.js#xfbml=1&version=v2.8&appId=1281569608559738"; 
      fjs.parentNode.insertBefore(js, fjs); 
     }(document, 'script', 'facebook-jssdk')); 
    </script> 
    <div id="iFramePlace"></div> 
</body> 

</html>

よろしく！

出典

2016-12-19 Selfster

あなたの引用符は、このブロックでオフに見て：

var strVar=""; 
strVar += "<div class=\"fb-post\" data-href=\""+ link + "" data-show- text=\"true\">"; 
strVar += "        <blockquote cite=\""+ link + "" class=\"fb-xfbml-parse-ignore\">"; 
strVar += "       <\/div>";

は試してみてください。

var strVar=""; 
strVar += "<div class=\"fb-post\" data-href=\""+ link + "\" data-show- text=\"true\">"; 
strVar += "        <blockquote cite=\""+ link + "\" class=\"fb-xfbml-parse-ignore\">"; 
strVar += "       <\/div>";

編集：私は

：

あなたはこのジャバスクリプトにはいくつかの問題を持っていますあなたのJavaScriptを同じタグのセットに入れておくことをお勧めします。あなたの体はやっていることさえあります。

$（function（）{}）; $（document）.ready（function（）{}）の短い手です。ページがロードされたときに起動するコードを示します。関数定義はこのブロックの外側にある必要があります。

この関数が成功した場合、挿入するdivには実際に表示されるコンテンツは表示されず、高さもありません。要素を調べるとdivを見ることができますが、フィドルでは表示させるためにCSSを追加しました。

私はそれが別の問題だと思うので、データを返すかどうかJSONをテストしませんでした。

これをチェックしてください。fiddle

出典

2016-12-19 19:02:55

まだ何もありません。理解できません。 divには高さがありますが、その中には何もありません。 –

あなたはあなたのhtmlとjavascriptの全体を投稿できますか？ jsブレークポイントでブラウザでデバッグを試みましたか？ –

私はそれをinital postに追加しました –

jQuery .html Facebook埋め込み

答えて

関連する問題