jQuery mobile类库使用时加载导航历史的方法简介
jQuery.mobile.navigate(url[,data])
改变URL和跟踪历史。作品为浏览器和无历史新的API
- url：是必须的参数。类型：字符串
- data：是可选的参数。类型：对象。
更改哈希片段两次然后日志提供导航事件数据时，浏览器向后移动的历史
//Startingathttp://example.com/
//AltertheURL:http://example.com/=>http://example.com/#foo
$.mobile.navigate("#foo",{info:"infoaboutthe#foohash"});
//AltertheURL:http://example.com/#foo=>http://example.com/#bar
$.mobile.navigate("#bar");
//Bindtothenavigateevent
$(window).on("navigate",function(event,data){
console.log(data.state.info);
console.log(data.state.direction)
console.log(data.state.url)
console.log(data.state.hash)
});
//AltertheURL:http://example.com/#bar=>http://example.com/#foo
window.history.back();
//Fromthe`navigate`bindingonthewindow,consoleoutput:
//=>"infoaboutthe#foohash"
//=>"back"
//=>"http://example.com/#bar
//=>"#bar"
劫持一个链接点击使用导航方法，然后加载内容
//Startingathttp://example.com/
//Defineaclickbindingforallanchorsinthepage
$("a").on("click",function(event){
//Preventtheusualnavigationbehavior
event.preventDefault();
//Altertheurlaccordingtotheanchor'shrefattribute,and
//storethedata-fooattributeinformationwiththeurl
$.mobile.navigate(this.attr("href"),{foo:this.attr("data-foo")});
//Hypotheticalcontentalterationbasedontheurl.E.g,make
//anajaxrequestforJSONdataandrenderatemplateintothepage.
alterContent(this.attr("href"));
});
热门推荐
10 比赛结束花束祝福语简短
11 18岁祝福语搞笑简短
12 婚礼祝福语简短精辟的
13 写给男生简短的祝福语
14 车行销售祝福语简短
15 祝福语简短古诗词
16 职场韩语祝福语大全简短
17 发小结婚简短祝福语
18 职场离职文案祝福语简短