jquery - 如何在 Jquery 中根据单选按钮选择闪烁数字？

Question

我有一些价格会根据单选按钮选择进行调整。我知道如何根据选择使数字发生变化，但如何让它们同时闪烁以吸引用户的眼球？

我试过这个:https://stackoverflow.com/a/11915453/5067193

它适用于第一个单选按钮更改，但不适用于任何后续更改。我希望它在每次单选按钮选择更改时闪烁。

编辑:

我找到了适合我的答案:

我必须添加一个 setTimeout 函数，所以现在我的 jquery 代码看起来像(将 jq 替换为 $):

jq("input:radio").click(function(){
    console.log('radio clicked');

    jq("#price").addClass("flash");

    setTimeout( function(){
        jq("#price").removeClass("flash");
    }, 1000);


});

我的 Flash CSS 看起来像这样:

.flash{

  -moz-animation: flash 1s ease-out;
  -moz-animation-iteration-count: 1;

  -webkit-animation: flash 1s ease-out;
  -webkit-animation-iteration-count: 1;

  -ms-animation: flash 1s ease-out;
  -ms-animation-iteration-count: 1;

}

@-webkit-keyframes flash {
    0% { color:transparent;}
    50% { color:#FFF;}        
    100% {color:transparent;}
}

@-moz-keyframes flash {
    0% { color:transparent;}
    50% { color:#FFF;}        
    100% {color:transparent;}
}

@-ms-keyframes flash {
    0% { color:transparent;}
    50% { color:#FFF;}        
    100% {color:transparent;}
}

Answer 1

您可以使用它，但您需要一个“jQuery(selector).removeClass("flash");"第一的。因此，它会在每次调用时移除和添加闪光灯。

像这样:

function $(".flashyRadio").click(function(){

$( "#price" ).removeClass( "flash" ).addClass( "flash" );

})