Question

此问题与this question yesterday有关。请参阅当前的jsfiddle here。

我已经能够使它工作，以便点击的div可以很好地缩放和动画。但我现在还有另外两个问题：

将点击的div缩放回原始大小后，当我再次单击相同的div重复操作时，脚本将无法运行。
我对跳跃的重新缩放/重新定位并不满意。我似乎无法顺利地工作。我想我会好好的，但是如果它和初始比例/动画一样平滑，我会更开心。

如果我需要更清楚，请告诉我。

非常感谢任何帮助！ MTIA。

Answer 1

它不会再次工作，因为当它不再是当前时，你会从中删除click处理程序：

selectedBox.unbind('click');

取消绑定来自div的所有点击处理程序，包括最初在ready中连接的那个。

四个选项：

~~不要取消绑定主要点击，并使用jQuery的事件“namespacing”进行第二次点击事件：~~

$('.current').bind('click.current', function() {

...然后在取消绑定时：

selectedBox.unbind('click.current');

确保在当前的单击处理程序中停止事件，因此不会运行主单击处理程序（jQuery确保处理程序以相反的顺序运行，因此您知道当前处理程序将在主处理程序之前运行，跨浏览器。。没关系，对不起，反过来说：jQuery确保它们按照绑定的顺序运行，而不是反向顺序。
~~对当前点击事件使用命名函数：~~

$('.current').click(currentClick); function currentClick() {

...并专门删除它：

selectedBox.unbind('click', currentClick);

~~...再次，不要删除主处理程序。~~
使用delegate而不是click进行主要（非当前）点击：
```
$('#content').delegate('.box', 'click', boxClickHandler);
```
它会挂起盒子容器上的click事件，而不是盒子本身，然后响应点击，因为它们会冒泡。

在“当前”点击处理程序中，请务必取消点击事件，使其不会冒泡到容器。

Here's a fiddle已实施此更改。我还命名为“当前”点击以便对任何其他可能需要知道何时单击一个框的代码友好。
删除当前点击处理程序后放回boxClickHandler：
```
selectedBox.unbind('click').click(boxClickHandler);
```
在处理程序中使用单个处理程序和分支，具体取决于您是否在框中看到“当前”类。

......或上述的某种组合。

我最喜欢＃5。

Answer 2

我知道你已经接受了克劳德先生的回应但是在玩了你的jFiddle后，似乎使用.toggle（）方法完成所有这些操作的方式要少得多

在更改类名后，不要在元素中添加和删除单击事件，只需让同一个元素在第二次单击时执行不同的操作。这真的可以为你节省很多工作。有点像这样的东西。

$(document).ready(function() {
    $('.box').toggle(click1,click2);
});
function click1(){
    $('.box').not(this).animate({left:2000},1000);
}
function click2(){
    $('.box').not(this).animate({left:0},1000);
}

Answer 3

我做了一个快速查看，可能只需修复序列，如链接事件。我在动画时点击了这个框，然后缩小并缩小，然后一切都失败了。

除此之外，你的动画非常棒！

jquery函数不会在之前单击的div上运行

3 个答案: