Question

关于jquery mobile的页面跳转

最近做到手机web页面，所以用到了jquery mobile 需要页面的跳转并传递参数，但是如果传递参数的话添加 data-ajax=“false”才能执行我的js 页面跳转效果就消息了

Answer 1

jm转场传参确实是奇葩的东西，首先你要理解：如果采用changePage转场，那么只需要第一个html引入Javascript，也就是说所有页面的Javascript是共享的。

那么一个解决方案是：你在page1.html通过changePage转场到page2.html之前，在Javascript中定义一个公共常量，这个常量就是要给page2.html的参数。然后跳转到page2.html的时候通过pageinit事件去获取常量。

var params1 = xxx;
$(document).on("pageinit","#page2",function(){  
  params1.... 
});

上面这是最简单但不安全合理的解决方法。

你说的禁用转场也可行，但是第二个页面就是全新页面了，不仅没转场效果，而且得重新加载所有文件，性能不行。

传说中最优的方案是绑定pagebeforechange事件，$(document).bind("pagebeforechange", handleChangePage)，这个事件能在page1跳转后、page2初始化前触发，并且通过e.target.baseURI可以获取URL信息，剩下就是解析参数，很简单了。

$(document).bind("pagebeforechange", beforechange);
function beforechange(e, data) {
		if (typeof data.toPage != "string") {
			var url = $.mobile.path.parseUrl(e.target.baseURI)
			var re = 'details.html';
			if (url.href.search(re) != -1) {
				var page = $(e.target).find("#detailsPage");
				var d = data.options.data;
				var data = getUrlParam(url.href);
				page.find("#nameDiv").html(decodeURIComponent(data[0]));
				page.find("#timeDiv").html(decodeURIComponent(data[1]));
				page.find("#contentDiv").html(decodeURIComponent(data[2]));
				
				
			}
		}
	}

可能你还有一些疑惑，这没问题，你可以去百度搜索"JqueryMobile转场和参数传递“，现在已经有很多文章介绍了。

最后吐槽一下：JqueryMobile在Android下真的跑不快！但是适合不懂移动开发，只会web开发的同学入门。