现在,我已经编写了jQuery Ajax代码来检查用户名和密码是否正确。但是,我想不仅仅显示错误消息,还要把元素抖动起来。
定义抖动是什么?
那种像WordPress一样的抖动。进入wordpress.com/wp-login.php并填写一些随机信息,元素就会抖动。
可以通过Animate.css实现这种抖动效果。
问题出在哪里?
当登录失败时,jQuery会执行以下操作。
$('.element').addClass('shake');
但是,由于抖动元素具有仅运行一次的CSS动画,因此在抖动元素后我们将不需要CSS shake类。
所以我尝试过:
$('.element').addClass('shake').removeClass('shake');
但那太快了。
所以我又尝试了一遍:
$('.element').addClass('shake').delay(1000).removeClass('shake');
仍然无法播放动画,然后从.element
中删除.shake
类。如果用户多次输入错误的详细信息,则抖动将无效。
您可以在此处玩弄这个小例子。
目标是通过单击抖动按钮来多次抖动元素。