添加jquery移动端推送事件

Question

我有一个列表视图，我正在尝试做的是在链接上添加一个卷帘事件。例如，如果用户滑动第一个链接，它将转到该页面。使用listview元素可以做到这一点吗？我尝试了div、href、a、li、ul，但仍然没有警报。它与身体一起工作。谢谢

<div>
  <ul data-role="listview" data-inset="true">
   <li class="rqstpage"><a href="./requests.php">Requests</a></li>
   <li><a href="./speakers.php" data-transition="pop">Control Panel</a></li>
   <li><a href="./schedule.html">Schedule</a></li>
   <li><a href="./information.html">Information</a></li>
  </ul>
</div>


<script>
$("div ul li.rqstpage").bind('swipe',function(event, ui){
  $.mobile.changePage("requests.php", "slide");
});
</script>

Answer 1

现场示例：

• http://jsfiddle.net/yxzZf/4/

JS：

$("#listitem").swiperight(function() {
    $.mobile.changePage("#page1");
});

HTML：

<div data-role="page" id="home"> 
    <div data-role="content">
        <p>
            <ul data-role="listview" data-inset="true" data-theme="c">
                <li id="listitem">Swipe Right to view Page 1</li>
            </ul>
        </p>
    </div>
</div>

<div data-role="page" id="page1"> 
    <div data-role="content">

        <ul data-role="listview" data-inset="true" data-theme="c">
            <li data-role="list-divider">Navigation</li> 
            <li><a href="#home">Back to the Home Page</a></li>
        </ul>

        <p>
            Yeah!<br />You Swiped Right to view Page 1
        </p>
    </div>
</div>

相关信息：

• Adding JQM swipe event to listview link

Answer 2

您是否尝试过通过live()使用绑定

UPDATE：.live()将被弃用，正确用法为.on()

它将处理程序附加到所有当前匹配元素以及以后可能匹配的元素的事件。

pageCreate() {
  $(parent).on('swipe', 'li.rqstpage', function() {
     $.mobile.changePage("requests.php", "slide");
  }
}

您是否考虑过将此库用于gestures

Answer 3

如果你直接将它绑定到控件上，它是否起作用，如下所示：

pageCreate() {
  $("li.rqstpage").swipe() {
     $.mobile.changePage("requests.php", "slide");
  }
}