jqeury mobile swiperight swiperight 左右滑動使用方法和遇到的問題

今天在使用jqeury mobile swiperight swiperight 左右滑動切換page頁面時出現了問題，反應慢和被瀏覽器當成前進後退

後來百度無果，換了bing.com才找到解決方案

jQuery Mobile Swipe

swipe 事件在用戶在某個元素上水平滑動超過 30px 時被觸發：

實例

$("p").on("swipe",function(){
  $("span").text("Swipe detected!");
});

親自試一試

jQuery Mobile Swipeleft

swipeleft 事件在用戶在某個元素上從左滑動超過 30px 時被觸發：

實例

$("p").on("swipeleft",function(){
  alert("You swiped left!");
});

親自試一試

jQuery Mobile Swiperight

swiperight 事件在用戶在某個元素上從右滑動超過 30px 時被觸發：

實例

$("p").on("swiperight",function(){
  alert("You swiped right!");
});

親自試一試

 jquery mobile 的所有事件都應該用在

$(document).ready(function(){
事件代碼應該放在這裏
});

左右滑動反應慢的問題問題是因爲默認30PX才觸發，所以改小點就可以了，使用下面代碼修改

$.event.special.swipe.horizontalDistanceThreshold = 5;

當你在手機瀏覽器，比如QQ瀏覽器上使用時，你會發現左右切換變成了瀏覽器中的前進後退，可以使用代碼來禁止他

		$(this).on("swiperight",function(e){
			
			e.stopImmediatePropagation();
			//return false;
		});

我完整的代碼，如下面的

//如果不懂請加羣，在我博客其他文章中有羣號
$(document).ready(function(){

	//我在一個頁面中包含了5個page
	$page_list_object = $('.page');

	//要切換頁面的link
	$index_page_link_list = ['./index.html#session',
							 './index.html#friends',
							 './index.html#groups',
							 './index.html#space',
							 './index.html#config'];
	//修改觸發像素大小
	$.event.special.swipe.horizontalDistanceThreshold = 5;
	//給頁面中的5個page都加上左右滑動事件
	$.each($page_list_object,function($index,$item){
		$(this).on("swipeleft",function(e){
			$current_index = $index <4 ? $index+1 : 4;
			$.mobile.changePage($index_page_link_list[$current_index]);
			 e.stopImmediatePropagation();
			//return false;

		});
		$(this).on("swiperight",function(e){
			$current_index = $index >0? $index-1 : 0;
			$.mobile.changePage($index_page_link_list[$current_index]);
			e.stopImmediatePropagation();
			//return false;
		});
	});

});