jquery - CSS/HTML/JQuery-如何使文本框闪烁并具有发光效果？

因此，我一直在尝试使文本框闪烁3次，并具有发光效果。
但是我只能让它眨眼一次。

有人可以看看这个，也许可以在这里帮助我？

的HTML

<input id="asktextsearch" name="search" type="text" placeholder="bla bla" />

的CSS

#asktextsearch{
    height: 20px;
    width: 440px;
    font-size: 12px;
    color: Grey;
    border: thin solid #CACACA;
    //margin-top: 60px;
    /* [disabled]border-radius: 10px 10px 10px 10px; */

    outline:none;
    transition: all 0.25s ease-in-out;
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
}

#asktextsearch:focus {
    box-shadow: 0 0 5px rgba(209, 27, 28, 1);
    -webkit-box-shadow: 0 0 5px rgba(209, 27, 28, 1);
    -moz-box-shadow: 0 0 5px rgba(209, 27, 28, 1);
}

jQuery查询

    for(i=0;i<3;i++){
        alert(i);
        $('#asktextsearch').focus();
        //$('#asktextsearch').addClass(':focus');
    };

最佳答案

LIVE DEMO

JS：

$(function(){

    var count    = 0,
        $input   = $('#asktextsearch'),
        interval = setInterval(function() {

    if ($input.hasClass('blur')) {

          $input.removeClass('blur').addClass('focus');
          ++count;

    } else {

          $input.removeClass('focus').addClass('blur');
    }

       if (count === 3) {

           clearInterval(interval);
       }

    }, 300);
});