0

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

你好，

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

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

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

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


$(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 中使用它应该不会引起任何问题吗？

提前致谢

4

2 回答 2

3

首先：窗口加载发生

你在打电话

.trigger("resize");

单击时激活绑定。

later on- 如果窗口加载再次发生 - 它再次触发代码 - 重新绑定点击

于 2012-02-06T12:01:55.770 回答
0

您的小提琴代码和您的实时代码之间的区别在于调整大小/方向处理程序的存在。

所有其他代码都在这意味着每次运行调整大小处理程序时都会运行它。http://jsfiddle.net/uTV5k/20/是您使用该处理程序的小提琴的变体。它行为不端。

您可以通过在使用添加新的单击处理程序之前删除旧的单击处理程序来解决此问题.off('click')。

这个小提琴包括这个更新，似乎再次表现：http: //jsfiddle.net/uTV5k/21/

解决此问题的另一种（可能更好）方法是重新计算您在 on resize 中需要的值并将它们更全局地存储。然后您的点击函数可以添加一次并引用这些全局值。这是一个更大的代码重写，我只是进行了非常简单的修复来突出您的问题。

于 2012-02-06T12:17:21.413 回答