0

我正在尝试在同一解决方案中导航内部 jqueryMobile 页面(data-page="mypage")和普通页面(xxxx.php)。我希望它的行为如下:

  • 从#lista-x 向右滑动并转到#listas
  • 从#listas 执行新的向右滑动并转到 index.php

问题是,如果我在#lista-x 上执行滑动,它会直接进入 index.php。我几乎看不到它正在执行这两个操作,也就是说,首先它转到#listas,然后是 index.php。这是我的代码(为了让您更容易理解而对其进行了简化):

 <!-- EXAMPLE.PHP -->
    <div data-role="page" id="listas">
            <a data-role="button" href="#lista-1">lista 1</a>
            <a data-role="button" href="#lista-2">lista 2</a>
            <a data-role="button" href="#lista-3">lista 3</a>
        </div>
        <div data-role="page" id="lista-1">
            //something...
        </div>
        <div data-role="page" id="lista-2">
            //something...
        </div>
        <div data-role="page" id="lista-3">
            //something...
        </div>


<script type="text/javascript">    
$("[id='listas']").bind('pageshow', function(){
    // Gestos táctiles
            $(function() {
                $("body").bind('swiperight', function(event) {
                        window.location = "mov-eventos.php";
                        // $.mobile.changePage( "mov-eventos.php");
                });

            });
    });


    $("[id^='lista-']").bind('pageshow', function(){
    // Gestos táctiles
        $(function() {
            $("body").bind('swiperight', function(event) {
                    $.mobile.changePage("#listas", "slide", false, true);
            });
        });
    });
</script>

我该如何解决它才能表现得像我之前解释的那样?:

提前致谢

4

1 回答 1

0

问题在于,尽管您只选择了一些元素(例如$("[id^='lista-']")),但您将swiperight事件绑定到 body 元素,因此swiperight会触发两次。您必须将其绑定到选定的元素。

于 2013-01-16T20:29:33.097 回答