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 公司乔迁食堂祝福语简短
12 婚礼结束聚餐祝福语简短
13 儿媳买车妈妈祝福语简短
14 毕业送礼老师祝福语简短
15 同事辞职正常祝福语简短
16 恭贺新婚文案祝福语简短
17 金店立秋祝福语简短英文
18 婆婆高寿祝福语大全简短