技术开发 频道

jQuery Mobile开发进阶:API扩展介绍

  jQuery Mobile自定义子页的KEY

  当在jQuery Mobile中引用子页时,默认使用的是ui-page做为KEY标识。开发者可以通过$.mobile对象的subPageUrlKey去重新设置,比如如果定义了subPageUrlKey为my-page,则默认的子页引用将从web-page.html&ui-page=value改为web-page.html&my-page=value,这样做的一个好处是开发者可让url更友善更容易维护。

  jQuery Mobile设置当前激活页面的样式

  当使用了jQuery Mobile后,默认当前激活页面中的ui-page元素都会使用框架默认的样式中定义的ui-page-active,如果要对其进行修改,可以设置$.mobile对象中的activePageClass属性,比如:

  $(document).bind("mobileinit", function(){

  $.mobile.activePageClass="ui-page-custom";

  });

  其中ui-page-custome则为用户自定义的样式。

  设置默认页面和对话框的动画效果

  默认的jQuery Mobile的页面和对话框的效果都是通过ajax实现的。默认的页面切换效果是幻灯片切换,默认的对话框出现的效果是弹出。如果需要改变这些效果的话 ,同样是如下代码所示,设置$.mobile对象的defaultPageTransition和defaultDialogTransition属性就可以了。

  $(document).bind("mobileinit", function() {

  $.mobile.defaultPageTransition = "fade";

  $.mobile.defaultDialogTransition = "fade";

  });

  jQuery Mobile提供了6种效果供用户选择,分别是:slide, slideup, slidedown, pop, fade, 和flip,用户可以按照上面的方法进行设置。

  自定义加载及错误信息.

  另外两个全局设置参数是加载及错误显示信息。加载信息会在加载页面时显示给用户看,要更改这个设置,只需要修改$.mobile对象的loadingMessage属性即可,如下:

  $(document).bind("mobileinit", function() {

  $.mobile.loadingMessage = "Please wait";

  });

  同样,可以设置$.mobile对象的属性pageLoadErrorMessage来自定义错误信息,如下:

  $(document).bind("mobileinit", function() {

  $.mobile.pageLoadErrorMessage = 'Sorry, something went wrong. Please try again.';

  });

 

0
相关文章