jQuery mobile类库使用时加载导航历史的方法简介_jquery

jQuery.mobile.navigate( url [, data ] )

改变URL和跟踪历史。作品为浏览器和无历史新的API

  • url:是必须的参数。类型:字符串
  • data:是可选的参数。类型:对象。 

更改哈希片段两次然后日志提供导航事件数据时,浏览器向后移动的历史

// Starting at http://example.com/
// Alter the URL: http://example.com/ => http://example.com/#foo

$.mobile.navigate( "#foo", { info: "info about the #foo hash" });

// Alter the URL: http://example.com/#foo => http://example.com/#bar

$.mobile.navigate( "#bar" );

// Bind to the navigate event

$( 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 )
});

// Alter the URL: http://example.com/#bar => http://example.com/#foo

window.history.back();

// From the `navigate` binding on the window, console output:
// => "info about the #foo hash"
// => "back"
// => "http://example.com/#bar
// => "#bar"

劫持一个链接点击使用导航方法,然后加载内容

// Starting at http://example.com/
// Define a click binding for all anchors in the page

$( "a" ).on( "click", function( event ) {

 // Prevent the usual navigation behavior

 event.preventDefault();

 // Alter the url according to the anchor's href attribute, and
 // store the data-foo attribute information with the url
 $.mobile.navigate( this.attr( "href" ), { foo: this.attr( "data-foo" ) });

 // Hypothetical content alteration based on the url. E.g, make
 // an ajax request for JSON data and render a template into the page.

 alterContent( this.attr( "href" ) );
});

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索jquery
, mobile
导航历史
jquerymobile动态加载、jquery mobile 预加载、jquery mobile 加载中、jquery mobile 加载、jquerymobile底部加载,以便于您获取更多的相关知识。

时间: 2024-08-17 14:04:38

jQuery mobile类库使用时加载导航历史的方法简介_jquery的相关文章

jQuery常用的4种加载方式分析[原创]_jquery

本文实例分析了jQuery常用的4种加载方式.分享给大家供大家参考,具体如下: 1. 页面加载之前执行,与嵌入的js加载方式一样: (function($){})(jquery) 示例: (function($){ alert('Hello jb51'); })(jquery); 2. 页面加载后执行: $(document).ready(function(){}) 示例: $(document).ready(function(){ alert('Hello jb51'); }); 3. 页面加

运用JQuery的toggle实现网页加载完成自动弹窗_jquery

toggle()事件 它主要切换元素的可见状态. 1.toggle(switch) ①switch是一个可选值,如果不填则原来元素是显示则将其隐藏,如果是隐藏则显示. HTML 代码: 复制代码 代码如下: <p>Hello</p><p style="display: none">Hello Again</p> jQuery 代码: 复制代码 代码如下: $("p").toggle() 结果: 复制代码 代码如下: &

jQuery实现根据滚动条位置加载相应内容功能_jquery

实现jQuery根据滚动条位置加载相应的内容:向下滚动时当内容区域滚动到可视窗口高度的一半时,加载动画内容:向上滚动到相应的内容区域时也重新加载动画内容! 1.实现思路: 先静态布局好HTML结构,使用伪类:hover模拟动画效果,再使用jQuery 控制动画类名的切换来实现效果!主要判断滚动的方向,以及相应方向上加载动画的时机(即何时才加载动画的判断条件!关键点!). 2.思维草稿图: 向下滚动加载动画判断条件:(代码中addClass()函数) 向上滚动加载动画判断条件:(代码中addCla

jquery Tab效果和动态加载的简单实例_jquery

一:tab效果显示 复制代码 代码如下: <html xmlns="http://www.w3.org/1999/xhtml"><head><title>无标题页</title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <script src="js/jquery-1.4.2-

jquery mobile-jQuery mobile 的listview可以加载多少数据

问题描述 jQuery mobile 的listview可以加载多少数据 jQuery mobile 的listview可以加载10000条据吗? 解决方案 $(function(){ ? ??????????????????? var data=[ ? ??????????????????????????????? {productName:'电脑键盘',price:'200',deposit:'50',repertory:'898',sale:'100'}, ? ??????????????

运用JQuery的toggle实现网页加载完成自动弹窗

 toggle()事件 它主要切换元素的可见状态,下面为大家介绍下运用JQuery的toggle实现网页加载完成自动弹窗 toggle()事件 它主要切换元素的可见状态.    1.toggle(switch) ①switch是一个可选值,如果不填则原来元素是显示则将其隐藏,如果是隐藏则显示.    HTML 代码:   代码如下: <p>Hello</p><p style="display: none">Hello Again</p> 

&amp;#106avascript使图片加载进度实时显示

加载|显示 javascript使图片加载进度实时显示 function chk(){  l--;  document.getElementById("aa").innerText=""+((sum-l)*100/sum)+"%"  if (l==0){     for (var i=0;i<sum;i++)       document.body.innerHTML+="<img src='"+imgs[i].s

jquery中如何在页面加载的时候根据action中的值的长度动态生成div

问题描述 jquery中如何在页面加载的时候根据action中的值的长度动态生成div 我action中的数据是保存在json中,然后要根据数据记录数生成多个div, //门店信息信息加载 $.ajax({ url:"findAllStoreInfoAction.action?workDate="+showCurrentTime(), dataType:"json", type:"POST", async:false, success: func

jQuery实现的瀑布流加载效果示例_jquery

本文实例讲述了jQuery实现的瀑布流加载效果.分享给大家供大家参考,具体如下: demo.js: $(function(){ $('img').load(function(){ var box = $('.box'); var boxHeight = { leftBox:[], centerBox:[], rightBox:[] } for(var i=0;i<box.length;i++){ var now = i%3; //now的值为0,1,2 switch(now){ case 0: