假设我有一个无序的列表,其中包含十个元素。
我希望将一个类随机添加到其中一个中,然后在几秒钟后删除该类,然后无限期地使用另一个随机选择的元素重新开始。
要做到这一点,最清洁的方法是什么?
编辑:到目前为止我得到了什么:
<ul id="hideAndSeek">
<li>...</li>
<li>...</li>
<li>...</li>
<li>...</li>
...
</ul>
jQuery:
var random = Math.floor(Math.random() * 1000);
var shownElement = $("#hideAndSeek li");
shownElement.eq(random % shownElement.length).addClass("shown");
但是,这显然不会持续运行,而且我不知道如何在删除类之前正确设置延迟。
发布于 2013-08-07 02:55:26
您需要使用setInterval
来创建一个计时器,然后您可以选择一个随机数并为该项索引设置类。
就像这样:
<ul>
<li>one</li>
<li>two</li>
<li>three</li>
<li>four</li>
<li>five</li>
<li>six</li>
<li>seven</li>
<li>eight</li>
<li>nine</li>
<li>ten</li>
</ul>
Javascript (w/ JQuery)
setRandomClass();
setInterval(function () {
setRandomClass();
}, 2000);//number of milliseconds (2000 = 2 seconds)
function setRandomClass() {
var ul = $("ul");
var items = ul.find("li");
var number = items.length;
var random = Math.floor((Math.random() * number));
items.removeClass("special");
items.eq(random).addClass("special");
}
发布于 2013-08-07 02:51:56
可以做这样的事情:
HTML
<ul id="randomCol">
<li>test1</li>
<li>test2</li>
<li>test3</li>
<li>test4</li>
<li class="color">test5</li>
<li>test6</li>
<li>test7</li>
<li>test8</li>
<li>test9</li>
<li>test10</li>
</ul>
Jquery
var tid = setInterval(changeUp, 1000);
function changeUp() {
var i = Math.floor((Math.random()*9));
$('#randomCol').children().removeClass('color');
$('#randomCol').children().eq(i).addClass('color');
}
https://stackoverflow.com/questions/18101314
复制相似问题