javascript - Twitter 嵌入时间线消失

Question

我通过 Jquery 嵌入了 Twitter 时间线，以便当用户单击按钮时，它会创建带有时间线的 div...当他再次单击它时，时间线就会消失。

这有效，但是当我再次单击该按钮时，它不想再次加载。所以我每页只加载一次。

$("#TWT").click(function(e) {
        e.preventDefault(); 
        if(loadHtml == "empty") {
        $( "#authorName" ).load( "test.html" );
        loadHtml = "full";
        } else if(loadHtml == "full") {
            $("#tweetDiv").remove();
            loadHtml = "empty";
            }
    });

test.html包含嵌入内容，loadHtml设置为空。

我的实际实现更为复杂，但我已将其简化为这样，以便我可以看到出了什么问题。包含 twitter feed 的 div 再次出现...但 feed 不会再次加载。

在不加载的情况下多次向页面提供嵌入时间线是否存在问题？如果我刷新页面，它会再次起作用......仅一次。

PS:只是澄清一下 - 这不是 div 不再显示的问题。当我查看生成的 html 时，它显示得很好。只是 Twitter 不想再次加载。

Answer 1

我刚刚遇到了类似的问题并解决了。 您必须包含一些像 twitter 提供的 JavaScript:

        !function(d,s,id){
            var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';
            if(!d.getElementById(id)){
                console.log("executed");
                js=d.createElement(s);
                js.id=id;
                js.src=p+"://platform.twitter.com/widgets.js";
                fjs.parentNode.insertBefore(js,fjs);
            }
        }(document,"script","twitter-wjs");

我通过注释 if() 语句解决了这个问题:

        !function(d,s,id){
            var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';
            //if(!d.getElementById(id)){
                console.log("executed");
                js=d.createElement(s);
                js.id=id;
                js.src=p+"://platform.twitter.com/widgets.js";
                fjs.parentNode.insertBefore(js,fjs);
            //}
        }(document,"script","twitter-wjs");