单击时,动画按钮

On click, animate button

本文关键字:按钮 动画 单击      更新时间:2023-09-26

当用户使用以下代码单击按钮时,我正在尝试对按钮进行动画处理

                <script language="javascript">
        $(function() {
            $("#b01").focusin(function() {
                animate(".btnn", 'bounce');
                return false;
            });
        });
        $(function() {
            $("#b02").focusin(function() {
                animate(".bl02", 'bounce');
                return false;
            });
        });
        $(function() {
            $("#b03").focusin(function() {
                animate(".bl03", 'bounce');
                $("#b03").focusout();
                return false;
            });
        });
        function animate(element_ID, animation) {
            $(element_ID).addClass(animation);
            var wait = window.setTimeout( function(){
                $(element_ID).removeClass(animation)}, 1300
            );
        }
    </script>

我想要一种更好的代码编写方式,这样如果按钮增加,我就不必只为该按钮添加特定函数。谢谢

  $("#b02").focusin(function() {
                animate(".bl02", 'bounce');
                return false;
            });

应该是:

  $(".btn").focusin(function() {
                animate(this, 'bounce');
                return false;
            });

然后为所有按钮分配一个类"BTN"。

并且不要到处都这样做:

$(function() {
     /// ... put your code in here
});

它应该只发生一次......并将所有的BTN代码放在那里。