当setinterval完成时，Javascript循环

请帮我循环完成时间间隔的脚本，当class="cur"转到最后p span我想再次循环它。我正在练习JavaScript代码，这就是我所做的。当setinterval完成时，Javascript循环

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script> 
<p style="font-size: 50px">This is a test</p> 
<script> 
function blink() { 
    $('.cur').next().css('color', '#333').addClass('cur'); 
    $('.cur:first').css('color', '#ccc').removeClass('cur'); 
} 
var str = $('p').text(); 
var count = str.length - 1; 
var splt = str.split(""); 
var newstr = ""; 
for(i=0;i<=count;i++) { 
    newstr += splt[i].replace(splt[i],"<span style='color: #CCC;'>"+splt[i]+"</span>"); 
} 
$('p').empty().append(newstr); 
$('p span:first').addClass('cur').css('color','#333'); 
setInterval('blink()', 100); 
</script>

来源

2011-03-18 Jorge

什么似乎是你的代码现在的问题？ – 2011-03-18 09:33:03

setTimeout而不是setInterval？

来源

2011-03-18 09:31:45 Bart

您需要检查，如果下一个.cur仍然存在。当它不存在（集合的长度为0）开始：

function blink() { 
    if ($('.cur').next().length == 0) { 
     $('p span:first').addClass('cur').css('color','#333'); 
     $('p span:last').removeClass('cur').css('color','#ccc'); 
     return; 
    } 
    $('.cur').next().css('color', '#333').addClass('cur'); 
    $('.cur:first').css('color', '#ccc').removeClass('cur'); 
}

现场测试案例：http://jsfiddle.net/yahavbr/QKYHt/

来源

2011-03-18 09:42:02

请参阅http://en.wikipedia.org/wiki/Don't_repeat_yourself – Alnitak 2011-03-18 09:47:10

非常感谢！这是最好的答案 – Jorge 2011-03-21 01:00:09

@blink我没有测试Alnitak的答案，但如果其他代码正在工作，那么它会更好，因为它更优化 - 我不花时间优化它，而是快速地编写代码。无论如何，请点击左边的“V”图标，接受您最终将使用代码的答案。 – 2011-03-21 08:32:45

如果$('.cur').next()是你需要再次回到第一区间空数组：

function blink() { 
    var cur = $('.cur'); 
    var next = $(cur).next(); 
    if (next.length == 0) { 
     next = $('p span:first'); 
    } 

    $(next).addClass('cur'); 
    $(cur).removeClass('cur'); 
}

工作演示在http://jsfiddle.net/cqkPV/3/

请注意，这不需要任何预先设置 - 第一次调用它会正确地突出显示第一个元素。在空列表上调用$(...).method()是jQuery中的NoOp。

注意：我已经从跨度和.css调用中删除了显式颜色，并将高亮颜色移动到CSS文件中。

来源

2011-03-18 09:45:53 Alnitak

当setinterval完成时，Javascript循环

回答

相关问题