jQuery Mobile刷卡不工作

我正在为一个项目创建我自己的图片库。为此我需要滑动事件。所以在jsfiddle上找到了下面的代码。插入所有必要的文件。它显示列表和所有..但仍然刷卡不工作。？我在正确的地方写jQuery代码吗？或者有什么不对？ Here`s我的代码：jQuery Mobile刷卡不工作

<html> 
     <head> 
     <meta charset="utf-8" /> 
     <title>Home</title> 
     <!-- Meta viewport tag is to adjust to all Mobile screen Resolutions--> 
     <meta name="viewport" 
      content="width=device-width, initial-scale=1, maximum-scale=1" /> 

     <link rel="stylesheet" type="text/css" href="Css/style.css" /> 
     <link rel="stylesheet" type="text/css" href="Css/Jstyle.css" /> 
     <link rel="stylesheet" type="text/css" href="Css/jquery.mobile.theme-1.2.0.css" /> 
     <link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.0b2/jquery.mobile-1.0b2.min.css" /> 

     <script type="text/javascript" src="Javascript/jquery1.js"></script> 
     <script type="text/javascript" src="Javascript/jquery2.js"></script> 
     <script type="text/javascript" src="css/jq1.6.2.js"></script> 

     <script type="text/javascript"> 
     $("#listitem").swiperight(function() { 
      $.mobile.changePage("#page1"); 
     }); 
     </script> 

     </head> 
     <body> 

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

        <ul data-role="listview" data-inset="true"> 
         <li id="listitem"> Swipe Right to view Page 1</a></li> 
        </ul> 

      </div> 
     </div> 

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

       <ul data-role="listview" data-inset="true" data-theme="c"> 
        <li id="listitem">Navigation</li> 

       </ul> 

       <p> 
        Page 1 
       </p> 
      </div> 
     </div> 

     </body>

来源

2013-02-18 Ashwin

什么小提琴？你真的把文件添加到你的服务器？如果你在普通电脑上看到任何错误 – mplungjan 2013-02-18 09:38:08

这个代码甚至不适用于我，即使我使用接受的解决方案 – Black 2016-04-29 14:26:57

尝试用pageinit处理程序的jQuery移动：

$(document).on('pageinit', function(event){ 
    $("#listitem").swiperight(function() { 
     $.mobile.changePage("#page1"); 
    }); 
});

Docs for pageinit @ jQuery Mobile的。

从文档：

Take a look at Configuring Defaults

由于jQuery的移动事件被立即触发，你需要加载jQuery Mobile的前事件处理程序绑定。链接到您的JavaScript文件的顺序如下：
<script src="jquery.js"></script> 
<script src="custom-scripting.js"></script> 
<script src="jquery-mobile.js"></script> 

来源

2013-02-18 09:39:30 Jai

谢谢jai ..它的工作:) – Ashwin 2013-02-18 12:46:33

我不喜欢这样一个事实：您将pageinit与mobileinit混淆。即使你个人不会混淆这两者，你的答案是关于pageinit，然后你引用一些关于mobileinit的内容。从我的Downvote。 – TigOldBitties 2013-11-19 09:59:41

先生，你刚刚救了我几个小时的头痛 – 2018-03-02 20:56:06

-2

这是我逼疯too..I没有用。对（“pageinit”）在以前的帖子建议。原来我的语法在我的JQuery中是正确的，但CASE SENSITIVTY是我的问题。 'swiperight'没有工作，但'swipeRight'没有！下面的代码适用于我，还解决了滑动防止在移动浏览器中上下滚动文档的问题。一定要单独指定swipeRight和swipeLeft方法，而不是一个通用的“滑动”类，并且您很好！ *注意底部的Exclude Elements行，注意我将'span'从列表中移出，以允许在常用的span元素上滑动。

$(function() { 

     $('.yourclassname').swipe( 
     { 
     swipeLeft:function(event, direction, distance, duration, fingerCount) 
     { 
      // do your swipe left actions in here, animations, fading, etc.. 
      alert(direction); 
     }, 
     swipeRight:function(event, direction, distance, duration, fingerCount) 
     { 
      // do your swipe right actions in here, animations, fading, etc.. 
      alert(direction); 
     }, 
     threshold:4, 
     // set your swipe threshold above 

     excludedElements:"button, input, select, textarea" 
     // notice span isn't in the above list 
     }); 
});

来源

2015-06-17 02:58:14 Victor

问题是关于“jQuery mobile”，而不是“touchSwipe库”-1 – 2016-03-10 18:11:12

jQuery Mobile刷卡不工作

回答

相关问题