Question

我正在以标准方式加载嵌入式Google日历：

<iframe id="calendar" src="https://www.google.com/calendar/embed...></iframe>

我想在使用jQuery的load事件之后应用一些样式更改，例如：

$('iframe#calendar').contents().find('.blahblah').css("display", "none");

我可能需要使用间隔循环：

var interval_calendar = setInterval(function(){
    if ($('#calendar').SOMETHING) {
        clearInterval(interval_calendar);
        $('iframe#calendar').contents().find('.blahblah').css("display", "none");
    }
} ,200);

如何检查日历是否已加载？基本上，我需要SOMETHING。

感谢。

Answer 1

您可以在iframe完成加载后使用load执行某项功能......

$("#calendar").load( function () {
    // do something once the iframe is loaded
});

Answer 2

尝试

        var iframe = $("<iframe>", {
                "id" : "calendar",
                "src" : "https://www.google.com/calendar/embed...",
                "target" : "_top"
        })
        // `iframe` `load` `event`
        .on("load", function (e) {
            $(e.target)
            .contents()
            .find(".blablah")
            .css("display", "none");
            return false
        });
        // $(element).append($(iframe))

jsfiddle http://jsfiddle.net/guest271314/a3UL5/

Answer 3

我找不到任何好的JavaScript事件解决方案，但您可以使用您的想法：

var interval_calendar = setInterval(function(){
    if ($('#calendarTitle').html()!= "") {
        clearInterval(interval_calendar);
        alert();
    }
} ,200);

calendarTitle ID仅在加载整个日历时显示在页面上。

另一方面，我不知道您是否可以访问日历属性，因为它们受到保护。您只能访问从主机加载的iframe内容。使用alert() 它有效，但如果您尝试访问任何内部内容，您将收到SecurityError消息到控制台。

加载嵌入式Google日历时的回调

3 个答案: