我有一个非常奇怪的特定项目,需要在多个弹出窗口中打开大量照片。 (我明白这个的可用性,请暂时绕过它。)
我在身体负荷上运行以下脚本,到目前为止有点:
// Popup window code
function runPopups() {
popupWin1 = setInterval(
function() {
window.open('assets/pic1.jpg', '_blank', 'width=490,height=300,left=-1000,top=-1000')
}, 3000);
//clearInterval(popupWin1);
popupWin2 = setInterval(
function() {
window.open('assets/pic2.jpg', '_blank', 'width=600,height=500,left=0,top=0')
}, 3000);
//clearInterval(popupWin2);
}
它实际上似乎加载了一次,但随后一直循环返回。当我添加
clearInterval
参数时,它完全破坏了脚本。我非常接近但不确定我做错了什么,因为 javascript 不是我的主要理解。我觉得我要么以某种方式错过了一个循环,要么我需要将它放入一个完全不同的函数中?
理想情况下,我希望每张照片都在屏幕上的随机位置弹出,延迟时间各不相同——如果每张照片都能越来越快,那就更好了。我将弹出大约 10-20 张图片。非常感谢帮助!
试试这个
// Popup window code
const assets = [{
url: 'assets/pic1.jpg',
settings: 'width=490,height=300,left=-1000,top=-1000'
}, {
url: 'assets/pic2.jpg',
settings: 'width=600,height=500,left=0,top=0'
}]
const runPopups = () => {
for (i = 0; i < assets.length; i++) {
window.open(assets[i].url, '_blank', assets[i].settings);
}
};
runPopups();
setInterval(runPopups, 3000);
使用 setTimeout 而不是 setInterval,因为 setInterval 意味着每 3 秒后打开弹出窗口,这就是它一次又一次打开的原因
// Popup window code
function runPopups() {
window.open('assets/pic1.jpg', '_blank', 'width=490,height=300,left=-1000,top=-1000')
setTimeout(function() {
window.open('assets/pic2.jpg', '_blank', 'width=600,height=500,left=0,top=0')
}, 3000);
//clearInterval(popupWin2);
}
您想使用带有
setTimeout
的 for 循环来单独安排每个弹出窗口。如果每个弹出窗口都有不同的名称和参数,您可以将其存储在一个数组中并使用 for 循环遍历它。
const popups = [
{
url: 'assets/pic1.jpg',
params: 'width=490,height=300,left=-1000,top=-1000',
},
{
url: 'assets/pic2.jpg',
params: 'width=600,height=500,left=0,top=0',
},
// Add the rest here
];
function runPopups() {
for (let i = 0; i < popups.length; i++) {
setTimeout(
() => window.open(popups[i].url, '_blank', popups[i].params),
(i + 1) * 3000
);
}
}
示例:https://stackblitz.com/edit/typescript-2rgp5n?file=index.ts
您安排第一个在 3 秒后弹出,第二个在 6 秒后弹出,第三个在 9 秒后弹出,依此类推。如果您希望第一个立即出现,只需删除
+ 1
.