javascript - 单击运行两次

Question

http://jsfiddle.net/uTV5k/19/

你好，

我在我的移动网站上使用以下脚本。请参阅模拟脚本和标记的jsfiddle。

下面的脚本正是我的移动网站上的脚本，js fiddle 是它的复制品。

在 jsfiddle 中，单击交替工作正常。第一次单击打开动画，第二次单击关闭动画。

我的移动网站上的问题，第一次单击打开动画，第二个动画在没有第二次单击后立即运行。但在 fiddle 中它运行正常。

$(window).load(function(){

    $(window).bind("orientationchange resize", function(e) {

        $('.home-mod').each(function() {

            var homeModule  = $(this).height(),
                homeTitle   = $(this).find('.home-title-button').outerHeight(),
                homeStart   = homeModule - homeTitle,
                homeOpen    = false;

            $(this).find('.mod-info').css("top", homeStart + "px");

            $(this).on('click', function () {

                if (homeOpen) {

                    // second click alternation
                    $(this).find('.mod-info').animate({ top: homeStart + "px" });
                    homeOpen = false;

                } else {

                    // first click alternation
                    $(this).find('.mod-info').animate({ top: 0 });
                    homeOpen = true; 

                }
            });

        }); 

    }).trigger("resize");

});

我真的不确定为什么会发生这种情况。在 iScroll 中使用它不会引起任何问题，不是吗？

提前致谢

Answer 1

首先:窗口加载发生

你正在打电话

.trigger("resize");

单击时激活绑定(bind)。

稍后 - 如果窗口加载再次发生 - 它会重新触发代码，再次 - 重新绑定(bind)点击