Question

我正在尝试在我的网站上集成Twitter Feed，但是通过以下设置，我的Feed被卡住显示“正在加载推文...”

以下是直接在索引页面上加载的脚本：

<script src="js/libs/jquery.twitter.js" type="text/javascript"></script>

<script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script>

<script type="text/javascript">
$(document).ready(function() {
        $("#twitter").getTwitter({
            userName: "username",
            numTweets: 3,
            loaderText: "Loading tweets...",
            slideIn: true,
            slideDuration: 750,
            showHeading: true,
            headingText: "Latest Tweets",
            showProfileLink: false,
            showTimestamp: false,
            target: "_top"
    });
});
</script>
<script>
if ($) {    //check if $ is defined - but this check results in an error!
$("#twitter").click (function () {});    //my jQuery code here
}
</script>

这是jquery.twitter.js文件中的代码：

   (function($) {
    /*
        jquery.twitter.js v1.5
        Last updated: 08 July 2009

        Created by Damien du Toit
        http://coda.co.za/blog/2008/10/26/jquery-plugin-for-twitter

        Licensed under a Creative Commons Attribution-Non-Commercial 3.0 Unported License
        http://creativecommons.org/licenses/by-nc/3.0/

        This code is modified by http://plugidea.com/iweb/
        Updated date: Mar 10, 2011
    */

    $.fn.getTwitter = function(options) {

        $.fn.getTwitter.defaults = {
            userName: null,
            numTweets: 5,
            loaderText: "Loading tweets...",
            slideIn: true,
            slideDuration: 750,
            showHeading: true,
            headingText: "Latest Tweets",
            showProfileLink: true,
            showTimestamp: true,
            target: "_blank"
        };

        var o = $.extend({}, $.fn.getTwitter.defaults, options);

        return this.each(function() {
            var c = $(this);

            // hide container element, remove alternative content, and add class
            c.hide().empty().addClass("twitted");

            // add heading to container element
            if (o.showHeading) {
                c.append("<h2>"+o.headingText+"</h2>");
            }

            // add twitter list to container element
            var twitterListHTML = "<ul id=\"twitter_update_list\"><li></li></ul>";
            c.append(twitterListHTML);

            var tl = $("#twitter_update_list");

            // hide twitter list
            tl.hide();

            // add preLoader to container element
            var preLoaderHTML = $("<p class=\"preLoader\">"+o.loaderText+"</p>");
            c.append(preLoaderHTML);

            // add Twitter profile link to container element
            if (o.showProfileLink) {
                var profileLinkHTML = "<p class=\"profileLink\"><a href=\"http://twitter.com/"+o.userName+"\">http://twitter.com/"+o.userName+"</a></p>";
                c.append(profileLinkHTML);
            }

            // show container element
            c.show();

            //$.getScript("http://twitter.com/javascripts/blogger.js");
            $.getScript("http://twitter.com/statuses/user_timeline/"+o.userName+".json?callback=twitterCallback2&count="+o.numTweets, function() {
                // remove preLoader from container element
                $(preLoaderHTML).remove();

                // remove timestamp and move to title of list item
                tl.find("li").each(function() {
                    var timestampHTML = $(this).children("a");
                    var timestamp = timestampHTML.html();
                    if (!o.showTimestamp) {
                        timestampHTML.remove();
                        $(this).attr("title", timestamp);
                    }
                    $('a',this).attr("target", o.target);
                });

                // show twitter list
                if (o.slideIn) {
                    // a fix for the jQuery slide effect
                    // Hat-tip: http://blog.pengoworks.com/index.cfm/2009/4/21/Fixing-jQuerys-slideDown-effect-ie-Jumpy-Animation
                    var tlHeight = tl.data("originalHeight");

                    // get the original height
                    if (!tlHeight) {
                        tlHeight = tl.show().height();
                        tl.data("originalHeight", tlHeight);
                        tl.hide().css({height: 0});
                    }

                    tl.show().animate({height: tlHeight}, o.slideDuration);
                }
                else {
                    tl.show();
                }

                // add unique class to first list item
                tl.find("li:first").addClass("firstTweet");

                // add unique class to last list item
                tl.find("li:last").addClass("lastTweet");
            });
        });
    };
})(jQuery);

我使用了开箱即用的解决方案，因为我对Javascript和jQuery相当新。为了安全起见，我将Twitter用户名替换为“用户名”。

非常感谢任何帮助。

Answer 1

确保在jQuery脚本/调用之前加载jQuery库。

据我所知，你不应该

<script>
if ($) {    //check if $ is defined - but this check results in an error!
$("#twitter").click (function () {});    //my jQuery code here
}
</script>

我相信username: "username", is where you actually input your account handle.

确保您的div也有ID的推特。

<div id="twitter"></div><!--end twitter -->

jQuery Twitter Feed不在静态网站上显示

1 个答案: