Javascript JQuery-IF语句只工作两到三次

我试图使这个页面工作，有一个垂直线的图片（缩略图大小），你可以点击，使他们滚动到全宽，并显示大量的文字和快乐的东西。 我已经做到了这一切。但是，如果我单击一个缩略图，任何打开的缩略图都应该关闭。我已经实现了一个IF语句和类检查：

$("a#shins-rec1").clickToggle(
function(){
        if ($(".shins-rec").hasClass('done')) {
            $(".shins-rec").filter($(".done").not($(this))).animate({
              left: $(".shins-rec").filter($(".done").not($(this))).width() / 2 - 60,
              width: '120px'}, 250, function(){
                $(this).removeClass('done');
            });
        } else {
            $(this).parent().animate({left: 0, width:'100%'}, 250, function(){
                $(this).addClass('done')
            });
        };
},
function(){
    $(this).parent().animate({
      left: $(this).parent().width() / 2 - 60,
      width: '120px'}, 250, function(){
        $(this).removeClass('done')
    }); // even clicks
});

这一切都很好，但当您在不同的缩略图上单击两到三次以打开它们并关闭其他缩略图后，已经打开的缩略图会被卡住，单击的缩略图会按其应打开的方式打开。您必须单击已单击的缩略图以关闭另一个缩略图，然后您必须等待一段时间，直到您可以单击已单击的缩略图以再次正确关闭它。在那之后，它就一直这样

我已经尝试过使用一个名为Summer of GOTO的插件，因为我认为它与检查是否有任何“完成”类有关，所以我想让它在JQuery中使用GOTO重新检查内容。使用WHILE语句也不起作用，但这可能是因为我不理解该函数

有人知道怎么解决这个问题吗

提前谢谢

---

编辑：：

看起来，即使您在每个缩略图上触发的单击也具有相同的ID，假设元素的ID是唯一的，您可以像这样使用类

$("a.shins-rec1").clickToggle(
function(){
        if ($(".shins-rec").hasClass('done')) {
            $(".shins-rec").filter($(".done").not($(this))).animate({
              left: $(".shins-rec").filter($(".done").not($(this))).width() / 2 - 60,
              width: '120px'}, 250, function(){
                $(this).removeClass('done');
            });
        } else {
            $(this).parent().animate({left: 0, width:'100%'}, 250, function(){
                $(this).addClass('done')
            });
        };
},
function(){
    $(this).parent().animate({
      left: $(this).parent().width() / 2 - 60,
      width: '120px'}, 250, function(){
        $(this).removeClass('done')
    }); // even clicks
});

---

我终于找到了问题的答案，有人在另一个论坛上重写了我的代码，因为代码凌乱，重复，他们解决了问题

是JSFIDLE，以防有人想调查它

由于某种原因，缩略图的方向发生了变化，使“左”的值为0，使缩略图位于中心，240或类似值使其向右移动。但我只是通过切换左边的值并将240或类似值改为负数来改变这一点，如下所示

var rightPos = -1 * ($('div.content-ins-used').width() / 2 - 60);

---

无论如何谢谢你的帮助

是否可以使用显示上面的副本？或者至少在图像卡住时提供控制台输出…尝试在

之前添加
.stop（）
。动画

听起来好像是在上一次单击完成之前发生的，这将设置错误的动画类finished@chridam啊，是的，我忘了。我刚刚编辑了问题：）。@Pete你是说像[…]过滤器（$（“.done”）。不是（$（这个）））.stop（）.animate（{left:[…]？这没有什么不同，但我想还是把它放在代码中比较好，以防人们点击快速。他们有不同的ID，但我忘了将我的JSFIDLE添加到问题中，所以无法看到。不过，问题现在包含了示例。