jQuery Mobile - Swiping - 停止处理新的页面加载

Question

所以我有一个基本的代码设置来使用jQuery Mobile，它在向左滑动时会移动两个特定的div，然后在向右滑动时将它们移回。很简单，它可以在它加载的页面上正常工作，但当你点击一个新页面并加载滑动不再有效。

请参阅下面附带的代码以供参考： -

$(document).on("pageinit",function(){
    $(document).on("swipeleft swiperight", function(e){
            if (e.type === "swipeleft") {
                $("#headerContainer").css({left:'-60px'});
                $("#mainContainer").css({marginLeft:'0px'});
            } else if (e.type === "swiperight") {
                $("#headerContainer").css({left:'0px'});
                $("#mainContainer").css({marginLeft:'60px'});
            }
    });
});

我已经尝试过寻找某种解决方案，但无济于事，所以非常感谢任何帮助，谢谢。

Answer 1

原来问题来自jQuery Mobile的工作方式。由于jQuery Mobile通过似乎是ajax加载页面意味着页面没有真正刷新并再次声明div，从而导致相对于ID的问题，因此选择Classes修复了这个问题。