Question

如何在1分钟内设置闪烁然后在下面取消设置我的jQuery函数的闪烁？

var html = '<table>';
for(var i in list)
{
    var tClass = list[i];

    if(jsonStr.currentTime == times[list[i].toLowerCase()]+":00")
    {
        $("#audio").html('<audio style="width: 100%;" class="audioDemo" controls preload="none" controlsList="nodownload"><source src="assets/audio/alarm2.mp3" type="audio/mpeg"></audio>');
        $(".audioDemo").trigger("play");

        tClass += " blinker";
    }

    html += '<td class="box"><span class="'+ tClass+'">'+ list[i]+'<div class="timeValue">'+ times[list[i].toLowerCase()]+'</div></span></td>';
}
html += '</table>';
document.getElementById('todayPrayTime').innerHTML = html;

$('.blinker').blink();

当前功能，它只会闪烁一次。

我想要的是将眨眼设置为1分钟，然后在此之后将其清除。

Answer 1

Blink plugin有停止闪烁的方法，因此您可以将其与$('.blinker').blink(); setTimeout( function(){ $('.blinker').unblink(); }, 60*1000);一起使用

$(document).ready(function() {
  $('.blinker').blink();

  setTimeout(function() {
    $('.blinker').unblink();
  }, 60 * 1000);
});

<强>演示

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://johnboker.github.io/jquery.blink.js"></script>
<div class="blinker">This line will blink</div>
<div class="noblinker">This line won't blink</div>

＆＃13;

ws

＆＃13;

Answer 2

解决此问题的一种方法是使用setTimeOut()：more info

在您的情况下，您可以将其添加到您的代码中：

setTimeout(function() {

$(".blinker").unblink();

},60000)

60000代表60次1000毫秒。

一次闪烁：尝试添加一个时间跨度：

$(".blinker").blink(500);

编辑：经过StackOverflow聊天的一些主要调试后，我们发现代码存在一些问题，导致上述解决方案失效。最后我们解决了这一切。但问题的主要答案在于上述解决方案。

Answer 3

你在这里不需要JS，因为这可以仅在CSS中完成。在下面的示例中，闪烁效果需要1秒才能完成，并且会发生60次：

＆＃13;

span {
  opacity: 0;
  animation: blinking 1s linear 60;
}

@keyframes blinking {
  from, 49.9% { opacity: 0; }
  50%, to { opacity: 1; }
}

＆＃13;

<span>Blink for 1 min...</span>

＆＃13;

Answer 4

您可以使用setInterval功能（https://www.w3schools.com/jsref/met_win_setinterval.asp）。 1分钟后使用clearInterval https://www.w3schools.com/jsref/met_win_clearinterval.asp

jQuery闪烁文本1分钟

4 个答案: