jQuery移动web开发中的页面初始化与加载事件

  • Z时代
  • 2024-01-10
  • 分类：综合

页面初始化事件(pagebeforecreate、pagecreate)

Jquery Mobile会自动基于page"内的增强的约定自动初始化一些插件。例如：给一个input输入框约定了type=range属性会自动生成一个自定义滑动条。这些自动初始化的行为是受"page"插件控制的，它在执行前后部署部署事件，允许你在初始化前后操作页面，或者甚至自己提供初始化行为，禁止自动初始化。注以下的页面初始化事件在每个“page”只被触发一次，与每次页面在显示或者隐藏的show/hide事件刚刚相反。

pagebeforecreate：页面初始化时，初始化之前触。

pagecreate：页面初始化时，初始化之后触。

$('#aboutPage').live('pagebeforecreate',function(event){
alert('This page was just inserted into the dom!');
});
$('#aboutPage').live('pagecreate',function(event){
alert('This page was just enhanced by Jquery Mobile!');
});

注意：通过绑定pagebeforecreate然后return false，你禁止页面插件自己的操作。而且，务必在 Jquery Mobile 执行前绑定这些函数，以使 他们在初始化页面加载时被调用。在 mobileinit 事件的处理函数中使用它们既可。

页面加载事件(pagebeforeload、pageload)

当外部的页面加载到dom中时，有两个事件被触发。第一个是 pagebeforeload，第二个是pageload ，或者pageloadfailed。

pagebeforeload

在加载请求发出之前触发，绑定到这个事件的回调函数可以可以对 该事件调用preventDefault()，来表明由他们来处理加载的请求。 这样的做的话回调函数必须对通过数据对象传到回调函数的对象调用resolve()或者reject()。通过第二个参数传到回调函数的对象包含如下的属性：

  • url (字符串)：通过回调传到$.mobile.loadPage()的绝对或者相对地址

  • absUrl (字符串)：url的绝对地址版本。

  • dataUrl (字符串)：绝对地址的当识别页面或者更新浏览器地址的时候使用的绝对地址经过过滤的版本

  • deferred (对象)：针对此事件调用preventDefault()的回调函数必须针对此事件调用

  • resolve()或者reject()方法，使得changePage()的请求恢复。

例如:

$( document ).bind( "pagebeforeload", function( event, data ){
 //让jqm框架知道由我们来处理load事件.
 event.preventDefault();
 //...加载文档然后插入到DOM中
 //在这个回调中，或者通过其他的异步加载手段中，
 //调用resolve,转入到下面的参数中，加上一个
 //包含有页面dom元素的jquery选择器。
 data.deferred.resolve( data.absUrl, data.options, page );
});

pageload

在页面已成功加载并插入到DOM后触发。绑定到这个事件的回调函数会被作为一个数据对象作为第二个参数。这个对象包含如下的信息：

  • url(字符串)：网址址。

  • absUrl(字符串)：url的绝对地址版本。

以上是 jQuery移动web开发中的页面初始化与加载事件 的全部内容， 来源链接： utcz.com/z/340437.html

回到顶部