每 20 秒更改 iframe 的 url 不适用于 javascript

发布于 2024-12-10 19:11:55 字数 1083 浏览 0 评论 0原文

我有一个 iframe，我想每 20 秒更新一次。所以基本上，iframe 的 url 应该从数组中更改为新的，并且每 20 秒刷新一次，但我的代码似乎不起作用。

var Uni = {
    init: function () {
        this.refresh();
    },

    refresh: function () {
        var urlArr = [
            'http://www.smashingmagazine.com/learning-javascript-essentials-guidelines-tutorials/',
            'http://stephendnicholas.com/archives/310',
            'http://msdn.microsoft.com/en-us/scriptjunkie/ff696765', 
            'http://www.jquery4u.com/jquery-functions/jquery-each-examples/'
        ],

        iframeSrc = document.querySelector('#uni iframe').src;

        for (var i = 0, max = urlArr.length; i < max; i++) {
            setInterval(function(){
                iframeSrc = urlArr[i];
            }, 20000);
        }   
    }
}

Uni.init();

HTML：

<body id="uni">
   <iframe src="http://www.smashingmagazine.com/learning-javascript-essentials-guidelines-tutorials/">
   You browser doesn't support iframes, please update it.
   </iframe>
</body>

请帮忙。

原文

I have an iframe that I wanna update every 20 seconds. So basically, the url of the iframe should change to a new one from the array and it refreshes, every 20 seconds but my code doesn't seem to work.

var Uni = {
    init: function () {
        this.refresh();
    },

    refresh: function () {
        var urlArr = [
            'http://www.smashingmagazine.com/learning-javascript-essentials-guidelines-tutorials/',
            'http://stephendnicholas.com/archives/310',
            'http://msdn.microsoft.com/en-us/scriptjunkie/ff696765', 
            'http://www.jquery4u.com/jquery-functions/jquery-each-examples/'
        ],

        iframeSrc = document.querySelector('#uni iframe').src;

        for (var i = 0, max = urlArr.length; i < max; i++) {
            setInterval(function(){
                iframeSrc = urlArr[i];
            }, 20000);
        }   
    }
}

Uni.init();

HTML:

<body id="uni">
   <iframe src="http://www.smashingmagazine.com/learning-javascript-essentials-guidelines-tutorials/">
   You browser doesn't support iframes, please update it.
   </iframe>
</body>

Please help.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

爱人如己 2024-12-17 19:11:56

~~检查 urlArr[] 声明的最后一行：~~

~~], // <- the comma should be a semicolon!~~

感谢@AndyE 的提示。

更新：解决方案+工作小提琴

var Uni = {
    interval_holder : false,
    urlArr : [],

    init: function (args) {
        if (args) {
            for (url in args) { this.addUrl(args[url]); }
        };
        this.refresh();
        this.interval_holder = setInterval('myuni.refresh()', 20000);
        return this;
    },

    refresh: function () {
        iframeObj = document.querySelector('#uni iframe');
        this.urlArr.unshift(iframeObj.src);
        iframeObj.src = this.urlArr.pop();
        return this;
    },

    stop : function () {
        clearInterval(this.interval_holder);
        return this;
    },

    addUrl : function(url) {
        this.urlArr.push(url);
        return this;
    },

    removeUrl : function(url) {
        this.urlArr.splice(this.urlArr.indexOf(url),1);
        return this;
    }
};

window.myuni = Uni.init([
    'http://www.smashingmagazine.com/learning-javascript-essentials-guidelines-tutorials/',
    'http://stephendnicholas.com/archives/310',
    'http://msdn.microsoft.com/en-us/scriptjunkie/ff696765', 
    'http://www.jquery4u.com/jquery-functions/jquery-each-examples/'
]);

~~Check the last line of your urlArr[] declaration:~~

~~], // <- the comma should be a semicolon!~~

Thanks to @AndyE for the hint.

Update: Solution + working fiddle

var Uni = {
    interval_holder : false,
    urlArr : [],

    init: function (args) {
        if (args) {
            for (url in args) { this.addUrl(args[url]); }
        };
        this.refresh();
        this.interval_holder = setInterval('myuni.refresh()', 20000);
        return this;
    },

    refresh: function () {
        iframeObj = document.querySelector('#uni iframe');
        this.urlArr.unshift(iframeObj.src);
        iframeObj.src = this.urlArr.pop();
        return this;
    },

    stop : function () {
        clearInterval(this.interval_holder);
        return this;
    },

    addUrl : function(url) {
        this.urlArr.push(url);
        return this;
    },

    removeUrl : function(url) {
        this.urlArr.splice(this.urlArr.indexOf(url),1);
        return this;
    }
};

window.myuni = Uni.init([
    'http://www.smashingmagazine.com/learning-javascript-essentials-guidelines-tutorials/',
    'http://stephendnicholas.com/archives/310',
    'http://msdn.microsoft.com/en-us/scriptjunkie/ff696765', 
    'http://www.jquery4u.com/jquery-functions/jquery-each-examples/'
]);

回复收藏 0 原文

橘亓 2024-12-17 19:11:56

iframe src 属性只是一个字符串，而不是指针。改变它没有任何效果。

用这个代替：

iframeObj = document.querySelector('#uni iframe');
for (var i = 0, max = urlArr.length; i < max; i++) {
    setInterval(function(){
        iframeObj.src = urlArr[i];
    }, 20000);
}

The iframe src attribute is only a string, not pointer. Changing it has no effect.

Have this instead:

iframeObj = document.querySelector('#uni iframe');
for (var i = 0, max = urlArr.length; i < max; i++) {
    setInterval(function(){
        iframeObj.src = urlArr[i];
    }, 20000);
}

回复收藏 0 原文

~没有更多了~