Question

我是手机上的新手。我正在使用phonegap为android在eclipse中创建应用程序。我在xml文件夹中添加了手机gap.jar和插件。我还添加了jquery库和phonegap1.1.0 js。我正在尝试实现滑动功能，将一个页面导航到另一个页面，但它不起作用。可以任何人告诉如何解决问题？

我在我的活动中打电话给inex.html 这是我的index.html

<html>
    <head>
        <title>sample check</title>
        <link rel="stylesheet" href="www/jquery.mobile/jquery.mobile-1.0rc2.min.css" type="text/css" charset="utf-8" />

        <script type="text/javascript" src="js/fnswipe.js"></script>
        <script type="text/javascript" src="www/jquery.mobile/jquery-1.6.4.min"></script>
        <script type="text/javascript" src="www/jquery.mobile/jquery.mobile-1.0rc2.min.js"></script>
        <script type="text/javascript" charset="utf-8" src="phonegap-1.1.0.js"></script>
    </head>
    <body>
        <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 smple check page</li> 
                    </ul> 
                </p> 
            </div> 
        </div> 
    </body>
</html>

这是我的js文件包含

$("#listitem").swiperight(function() { 
    $.mobile.changePage("file:///android_asset/www/samplecheck.html"); 
});

感谢您的帮助

Answer 1

我遇到了同样的问题，所有刷卡事件都在Android上运行。要解决此问题，我必须为滑动事件设置阈值。您可以在JS文件中调用滑动事件之前设置它们。为了获得最佳效果，我将其设置为：

$.event.special.swipe.scrollSupressionThreshold = 10; // More than this horizontal displacement, and we will suppress scrolling.
$.event.special.swipe.horizontalDistanceThreshold = 30; // Swipe horizontal displacement must be more than this.
$.event.special.swipe.durationThreshold = 500;  // More time than this, and it isn't a swipe.
$.event.special.swipe.verticalDistanceThreshold = 75; // Swipe vertical displacement must be less than this.

这个答案对我有很大帮助：swipeleft/swiperight triggered during vertical scroll in jquery mobile

以及文档：Events -> Touch Events -> Swipe

希望这会有所帮助!!

Answer 2

尝试与此类似的代码，看看它是否有任何帮助。

function( event ) {
  var data = event.originalEvent.touches ?
      event.originalEvent.touches[ 0 ] : event;
  return {
      time: ( new Date() ).getTime(),
      coords: [ data.pageX, data.pageY ],
      origin: $( event.target )
    };
}
)

And the when the swipe stops (

function( event ) {
  var data = event.originalEvent.touches ?
      event.originalEvent.touches[ 0 ] : event;
  return {
      time: ( new Date() ).getTime(),
      coords: [ data.pageX, data.pageY ]
    };
}
)

This method receives the start and stop objects and handles the logic for and triggering for the swipe events.

(

function( start, stop ) {
  if ( stop.time - start.time < $.event.special.swipe.durationThreshold &&
    Math.abs( start.coords[ 0 ] - stop.coords[ 0 ] ) > $.event.special.swipe.horizontalDistanceThreshold &&
    Math.abs( start.coords[ 1 ] - stop.coords[ 1 ] ) < $.event.special.swipe.verticalDistanceThreshold ) {

    start.origin.trigger( "swipe" )
      .trigger( start.coords[0] > stop.coords[ 0 ] ? "swipeleft" : "swiperight" );
  }
}
)

HTMl code (

<script>
$(function(){
  // Bind the swipeHandler callback function to the swipe event on div.box
  $( "div.box" ).on( "swipe", swipeHandler );

  // Callback function references the event target and adds the 'swipe' class to it
  function swipeHandler( event ){
    $( event.target ).addClass( "swipe" );
  }
});
</script>

Answer 3

你可以试试这个

$("#listitem").on("swiperight", function() { 
    $.mobile.changePage("file:///android_asset/www/samplecheck.html"); 
});

Answer 4

我正在使用jquery mobile 1.2.0来刷页面。此功能不依赖于phonegap或cordova。这是我的工作代码。希望这会对你有所帮助：

$(document).bind("pageinit", function(event) {
    $('#page').unbind("swipeleft");
    $("#next").unbind("swiperight");

     $("#page").bind("swipeleft",function(event) {
        $.mobile.changePage('next.html',  {
            transition : "slide"
        });
     });

     $("#next").bind("swiperight",function(event) {
        $.mobile.changePage('index.html', {
            transition : "slide",
            reverse : true  
        });
     });
});

使用jquerymobile和phonegap for android的滑动功能无效

4 个答案: