按下button
后,我想在input
中按顺序显示完整的列表文本li
,每两秒显示一次A -- B -- C -- D -- E
我试过了,但是不管用
<button>show li in order every 2 seconds</button>
<input type=text id="show" />
$("button").on("click",function(){
$(".menu li").each(function(){
setTimeout(function() { $("show").($(this).text()); }, 2000);
});
});
input{
width:40px;
height:40px;}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<button>show li in order every 2 seconds</button>
<input type=text id="show" />
<ul class="menu">
<li>A</li>
<li>B</li>
<li>C</li>
<li>D</li>
<li>E</li>
</ul>
3条答案
按热度按时间1cklez4t1#
您需要使用
setInterval
并从.menu li
递增地设置文本u2nhd7ah2#
bvuwiixz3#
您可以使用嵌套的setTimout*(也称为Chained Timeout)* 来完成此操作,否则结果将在最后一次显示(显示只有最后一次工作的外观)。
pop()
方法获取/删除最后一个数组元素,因此我们希望首先反转数组,以便根据您的问题规格以其原始顺序弹出字符。使用pop()
为我们提供了一种只运行一次数组的快速方法。我更喜欢使用嵌套的
setTimeout()
,而不是使用setInterval()
,因为setTimeout会在完成后再次调用自己,而setInterval会在计时器上重新运行自己。因此,如果有任何延迟完成函数,下一个setInterval仍将按计划运行 *,这意味着函数的多个示例可能会堆叠起来。链式超时为浏览器提供了一个有保证的空闲时间; Interval尝试确保它正在运行的函数尽可能接近其计划的时间执行,以牺牲浏览器UI的可用性为代价。
setTimeout还是setInterval?