jquery - 同一 div 内的 jQuery 焦点/模糊切换

Question

$('#topcontainer input,select').focus(function() {

   $("#square1").animate({"opacity":"1"}, 400);

}).blur(function() {

    $("#square1").animate({"opacity":"0.2"}, 400);

});

这是基本上可以工作的代码。但是，当我在同一个 div 内的不同输入（或选择）之间切换时，会发生代码循环。当我单击一个输入 square1 将其不透明度更改为 1 时，当我传输仍然在同一 div 容器中的第二个输入时，代码会自行循环，不透明度变为 0.2，然后变为 1。有没有办法不循环它而我位于同一个div。

谢谢

Answer 1

不知道你想要什么，但我想你应该

使用 jQuery .stop停止正在进行的动画。

$('#topcontainer input,select').focus(function() {

   $("#square1").stop().animate({"opacity":"1"}, 400);

}).blur(function() {

    $("#square1").stop().animate({"opacity":"0.2"}, 400);

});

看到这个小提琴。单击任何控件，然后单击其他任何位置。