gpt4 book ai didi

javascript - 单击时循环遍历数组

转载 作者:行者123 更新时间:2023-12-02 18:03:30 24 4
gpt4 key购买 nike

我有一个 URL 数组,例如:

var urls = ["http://www.getbootstrap.com","http://www.reddit.com","http://www.bbc.com/news","http://www.google.com"];

我有一个 iframe:

<iframe></iframe>

和两个链接:

<a href="#" id="forwards">Forwards</a> <a href="#" id="backwards">Backwards</a>

我想做的是将其链接起来,以便 <iframe>显示数组中的第一个 URL,当您单击向前或向后时,它会更改 src属性为下一个 url 或前一个 url。此外,当它位于数组的开头或结尾时,单击按钮应分别将其带到数组的结尾或开头。我有这个:

$('#forwards').click(function(){
current++;
$('iframe')[0].src = urls[current];
});

向后移动也是一样的,但是效率非常低,并且当你到达数组的任一端时都不起作用。有更好的方法吗?

最佳答案

DEMO

var urls = ["http://www.getbootstrap.com",
"http://www.reddit.com",
"http://www.bbc.com/news",
"http://www.google.com"
],
c = 0,
n = urls.length;

$('#forwards, #backwards').click(function( e ){
e.preventDefault();
c = this.id=='forwards' ? ++c : --c;
c = c<0? n-1 : c%n ;

$('iframe')[0].src = urls[c];
});

n.b. Google 使用 X-Frame-Options header 来防止其服务嵌入到外部页面内的 iframe 中。

关于javascript - 单击时循环遍历数组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20309193/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com