[英]How can I get my javascript function randomly select one function(slideshow), execute it, then repeat?
I have a javascript code for replacing a html <div>
that contains an image in it, so it becomes like a slide show. 我有一个javascript代码来替换其中包含图像的html
<div>
,因此它变得像幻灯片一样。 I have six of these slideshows on the page, and I need them to randomly change maybe switch image 3 then 6 then 2 and ect. 我在页面上有六个这样的幻灯片,我需要它们随机更改,也许先切换图像,然后依次为3、6、2,等等。
$(document).ready(function(){
SlideShow6();
});
function SlideShow6() {
$('#slideshow6 > div:gt(0)').hide();
setInterval(function () {
$('#slideshow6 > div:first')
.fadeOut(0)
.next()
.fadeIn(0)
.end()
.appendTo('#slideshow6');
}, 0000);
}
The time over here at the end is 0000
(0)seconds. 最后的时间是
0000
(0)秒。 Becuase I need the timer to have a 2000
(2)second pause before picking a random slide to slide. 因为我需要计时器在选择随机幻灯片之前要有
2000
(2)秒的暂停时间。 I tried my script with this: 我尝试使用此脚本:
var funcs = [];
funcs[0] = function() {
$('#slideshow6 > div:gt(0)').hide();
setInterval(function () {
$('#slideshow6 > div:first')
.fadeOut(0)
.next()
.fadeIn(0)
.end()
.appendTo('#slideshow6');
}, 0000);
}
funcs[1] = function() {
$('#slideshow5 > div:gt(0)').hide();
setInterval(function () {
$('#slideshow5 > div:first')
.fadeOut(0)
.next()
.fadeIn(0)
.end()
.appendTo('#slideshow5');
}, 0000);
}
// and so on six times... then... //等六次...然后...
$(document).ready(function(){
var rand = parseInt(Math.random()*funcs.length);
funcs[rand]();
setTimeout(arguments.callee, 2000);
});
It becomes really weird, it selects my functions randomly but it executes the slideshow a unlimited number of times and before soon all six of them are on and going. 它真的变得很奇怪,它随机选择我的功能,但是它无限次地执行幻灯片放映,并且很快所有六个功能都开始运行。 Maybe because of the
0000
? 也许是因为
0000
? I need them to switch image one by one. 我需要他们一张一张地切换图像。
----------UPDATE---------- I'm not sure if it was understandable from the code above but the SlideShow6
function repeats 6 times with a different funcs[1]
number every time so that it can add slideshows for all 6 images into the funcs[]
array. ----------更新----------我不确定上面的代码是否可以理解,但是
SlideShow6
函数以不同的funcs[1]
编号重复6次时间,以便可以将所有6张图片的幻灯片添加到funcs[]
数组中。
I am a newbie to JavaScript but in words this is how I image the code: 我是JavaScript的新手,但是用语言来说,这就是我对代码的印象:
Need to make an array so I put all these functions into into it 需要制作一个数组,所以我将所有这些功能放入其中
var funcs = [];
funcs[0] = function() {
$('#slideshow1 > div:gt(0)').hide();
setInterval(function () {
$('#slideshow1 > div:first')
.fadeOut(0)
.next()
.fadeIn(0)
.end()
.appendTo('#slideshow1');
}, 0000);
}
funcs[1] = function() {
**All the same except number slideshow1 changes to 2,3,4,5, and 6**
}
funcs[2] = function() {
}
funcs[3] = function() {
}
funcs[4] = function() {
}
funcs[5] = function() {
}
Then you need to call it up so make a math function that chooses 1-6 randomly which ever number is chosen then that functions is played out once. 然后,您需要调用它,使数学函数随机选择1-6,无论选择哪个数字,然后该函数就会播放一次。 Then the randomize pick another number in 2 seconds.
然后在2秒内随机选择另一个数字。 And another image slide changes.
另一个图像幻灯片发生了变化。 That's all it is every 2 seconds forever.
就是每2秒钟永远存在。 Thanks.
谢谢。
All testing done in Chrome console: 在Chrome控制台中完成的所有测试:
Setting the second parameter of setInterval
to 0
causes the function to be run an unlimited number of time. 将
setInterval
的第二个参数设置为0
导致该函数无限次运行。 I don't know why - I would expect the function to simply run a single time immediately. 我不知道为什么-我希望该功能可以立即立即运行一次。
You can see this in your console by doing: 您可以通过执行以下操作在控制台中看到此内容:
setInterval(function () {
console.log('Crazy');
}, 0000);
(There was a few iterations of this post which I have removed for brevity since they were deemed non-sufficient by question OP.) (为简短起见,我删除了这篇文章的一些重复内容,因为问题OP认为它们不够用。)
Update 2: 更新2:
var funcs = [];
funcs[0] = function() {
$('#slideshow6 > div:gt(0)').hide();
$('#slideshow6 > div:first')
.fadeOut(0)
.next()
.fadeIn(0)
.end()
.appendTo('#slideshow6');
}
funcs[1] = ...;
funcs[2] = ...;
funcs[3] = ...;
funcs[4] = ...;
funcs[5] = ...;
$(document).ready(function() {
window.setInterval(function() {
var rand = Math.floor(Math.random() * funcs.length);
funcs[rand]();
}, 2000);
});
I think this is a much more elegant solution. 我认为这是一个更为优雅的解决方案。 What this does: loop forever.
这是什么:永远循环。 Every loop iteration, wait 2 seconds and then switch a random image.
每次循环迭代,等待2秒钟,然后切换随机图像。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.