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");

Answer 2

有可能#tweetDiv是#authorName的父级吗？如果是这样的话，$（＆＃34;＃tweetDiv＆＃34;）。remove（）将导致#authorName也从DOM中删除，这意味着你的下一个.load（）不会针对任何元素页面。

另一方面，如果您要显示/隐藏内容，我建议您使用.show（）和.hide（），这些内容在浏览器上较便宜，因为它不会＃＆＃ 39;改变DOM节点。

Twitter嵌入式时间线消失

2 个答案: