1

我正在尝试一些新的东西,并在我可以爬行之前尝试跑步。我在测试页面中使用 jQuery 脚本来检索和显示来自谷歌日历的事件。脚本效果很好(因为它是别人制作的!!)

我正在使用脚本过滤掉仅包含特定文本的事件,再次所有工作,这些都显示在div.

然后我想用不同的过滤器在另一个中显示一组不同的结果,div我只是想我可以再次调用该函数,但是当我这样做时,结果并不总是正确的div,有时会被添加到同一个或上一个框。每次刷新都会得到不同的结果。

结果是正确的,所以提要正在工作,所以我认为这与文档未准备好或提要延迟有关?

谁能指出我正确的方向。

页面中的代码(Feed 匿名):

jQuery(function ($) {
    $.gCalReader({
        feedUri: 'https://www.google.com/calendar/feeds/abc@group.calendar.google.com/public/full',
        maxresults: 4,
        textfilter: 'ladies',
        targetDiv:'#ladiesEvents'
    });

    $.gCalReader({
        feedUri: 'https://www.google.com/calendar/feeds/abc@group.calendar.google.com/public/full',
        maxresults: 4,
        textfilter: 'seniors',
        targetDiv:'#seniorEvents'
    });

    $.gCalReader({
        feedUri: 'https://www.google.com/calendar/feeds/abc@group.calendar.google.com/public/full',
        maxresults: 4,
        textfilter: 'open',
        targetDiv:'#openEvents'
    });

    $.gCalReader({
        feedUri: 'https://www.google.com/calendar/feeds/abc@group.calendar.google.com/public/full',
        maxresults: 4,
        textfilter: 'social',
        targetDiv:'#socialEvents'
    });

    $.gCalReader({
        feedUri: 'https://www.google.com/calendar/feeds/abc@group.calendar.google.com/public/full',
        maxresults: 4,
        textfilter: 'junior',
        targetDiv:'#juniorEvents'
    });
});

这是被调用的函数:

(function ($) {
    //Add gcal element
    $(document).ready(function () {
        $('body').prepend('<div id="loading">Loading...</div>');
    });

    //Resize image on ready or resize
    $.gCalReader = function (options) {
        //Default settings
        var settings = {
            //defaults??
            feedUri: 'https://www.google.com/calendar/feeds/abc@group.calendar.google.com/public/full',
            maxresults: 20,
            displayCount: 1
        };

        var feedUri = options.feedUri;
        if (feedUri.indexOf("public/full") == -1) {
            feedUri = settings.feedUri;
        }

        var options = $.extend(settings, options);
            //properties form options are combined with settings??

        function _run() {
            var calendarService = new google.gdata.calendar.CalendarService('GoogleInc-jsguide-1.0');

            // The "public/full" feed is used to retrieve events from the named public calendar with full projection.
            var query = new google.gdata.calendar.CalendarEventQuery(feedUri);

            // Set the query with the query text
            query.setFullTextQuery(options.textfilter);

            query.setOrderBy('starttime');
            query.setSortOrder('ascending');
            query.setFutureEvents(true);
            query.setSingleEvents(true);
            query.setMaxResults(options.maxresults);

            //alert(options.targetDiv);

            var callback = function (result) {

                var entries = result.feed.getEntries();
                //clear the loading div
                $('#loading').html('');
                if (options.displayCount) {
                    $(options.targetDiv).append(entries.length + ' upcoming events');
                }
                $(options.targetDiv).append('<ul id="eventlist"></ul>');

                for (var i = 0; i < entries.length; i++) {
                    var eventEntry = entries[i];
                    var eventTitle = eventEntry.getTitle().getText();
                    var startDateTime = null;
                    var eventDate = null;
                    var eventWhere = null;
                    var eventContent = eventEntry.getContent().getText();

                    var times = eventEntry.getTimes();
                    if (times.length > 0) {
                        startDateTime = times[0].getStartTime();
                        eventDate = startDateTime.getDate();
                    }

                    var d_names = new Array("Sun", "Mon", "Tues", "Wed", "Thurs", "Fri", "Sat");
                    var m_names = new Array("Jan", "Feb", "Mar", "Apr", "May", "June", "July", "Aug", "Sept", "Oct", "Nov", "Dec");

                    var a_p = "";
                    var d = eventDate;
                    var curr_hour = d.getHours();
                    if (curr_hour < 12) {
                        a_p = "am";
                    }
                    else {
                        a_p = "pm";
                    }
                    if (curr_hour == 0) {
                        curr_hour = 12;
                    }
                    if (curr_hour > 12) {
                        curr_hour = curr_hour - 12;
                    }

                    var curr_min = d.getMinutes();
                    curr_min = curr_min + "";

                    if (curr_min.length == 1) {
                        curr_min = "0" + curr_min;
                    }

                    var time = curr_hour + ':' + curr_min + a_p;
                    var day = eventDate.getDay();
                    var month = eventDate.getMonth();
                    var date = eventDate.getDate();
                    var dayname = d_names[day];
                    var monthname = m_names[month];
                    var location = eventEntry.getLocations();
                    var eventWhere = location[0].getValueString();

                    var eventhtml = '<div id="eventtitle">' + eventTitle + '</div>  When: ' + dayname + ' ' + monthname + ' ' + date + ', ' + time + '<br>Where: ' + eventWhere + '<br>' + eventContent;
                    $('#eventlist').append('<li>' + eventhtml + '</li>');
                }
            };

            // Error handler to be invoked when getEventsFeed() produces an error
            var handleError = function (error) {
                $('#gcal').html('<pre>' + error + '</pre>');
            };

            // Submit the request using the calendar service object
            calendarService.getEventsFeed(query, callback, handleError);
        }
        google.setOnLoadCallback(_run);

        $(window).load(function () {

        });     //End window load
    };

})(jQuery);

谢谢

更新:因为我不能回答,直到另外 7 个小时......哈哈!!!!

发现了问题 - 完全取决于事件列表元素的 ID。

因为现在页面中有该元素的多个实例,所以我假设它正在将结果转储到任何可用的地方。

我已经对其进行了编码以使每个事件列表的 id 都是唯一的,现在它可以工作了

尤里卡!!!

4

1 回答 1

0

发现了问题 - 完全取决于事件列表元素的 ID。

因为现在页面中有该元素的多个实例,所以我假设它正在将结果转储到任何可用的地方。

我已经对其进行了编码以使每个事件列表的 id 都是唯一的,现在它可以工作了

于 2012-03-31T08:32:43.467 回答