0

我正在使用以下代码使用户能够使用向上和向下箭头键显示或隐藏照片描述 ( #photoinfo) 和菜单 ( )。.slidetable如果这两个 div 中的一个已经打开,则在打开另一个之前按相反的箭头会关闭该 div。

$(document).unbind('keypress');
$(document).keydown(function(event) {
    switch (event.keyCode) {
    case 38:
        if ($('#photoinfo').is(".open")) {
            closeInfo();
        }
        else if ($('.slidetable').is(".open")) {
            closeSlide2();
            openInfo();
        }
        else {
            openInfo();
        }
        break;
    case 40:
        if ($('.slidetable').is(".open")) {
            closeSlide();
        }
        else if ($('#photoinfo').is(".open")) {
            closeInfo();
            openSlide();
        }
        else {
            openSlide();
        }
        break;
    }
    return false;
});​

它似乎有效,唯一的问题是如果同时按下两个箭头,或者一个接一个地按下,两个 div 打开,相互重叠。我正在寻找一种keydown在第一个动画启动后基本上取消绑定函数的方法,并在keydown它完成后重新绑定函数。我是 jQuery 新手,所以也许这不是最好的方法。在动画期间防止其他功能触发的最简单方法是什么?

4

2 回答 2

1

您可以在触发动画之前将布尔值 (isAnimating) 设置为 true,并在动画完成后将其设置为 false。在keydown的顶部只是说

if(isAnimating)
{
  event.preventDefault();
  return false;
}

我不记得在动画结束时调用函数的语法,但它在 jQuery 的文档中

于 2010-09-27T18:36:21.400 回答
0

对不起,我有点困惑。你的答案的实现会像这样,还是我很遥远?

$(document).unbind('keypress'); 
$(document).keydown(function(event) {
            if(isAnimating)
            {
              event.preventDefault();
              return false;
            }

            switch (event.keyCode) {

                case 38: var isAnimating = true; 

                        if ($('#photoinfo').is(".open")) {
                            closeInfo();

                        }

                        else if ($('.slidetable').is(".open")) {
                            closeSlide2();
                            openInfo();

                        }

                        else {
                            openInfo();


                        } break;


                case 40: var isAnimating = true;
                        if ($('.slidetable').is(".open")) {
                              closeSlide();

                        }

                        else if ($('#photoinfo').is(".open")) {
                            closeInfo();
                            openSlide();

                        }

                        else {
                            openSlide();

                        } break;    

            }
            var isAnimating = false;                                
            return false;
}); 
于 2010-09-27T22:04:45.580 回答