1。覆盖mobile的默认值
配置选项
以下是 $.mobile对象的可配置选项以及其默认值:
subPageUrlKey (string, default: "ui-page"):
url参数用来引用由插件生成的子页面(例如那些由嵌套的listview生成的子页面) 例如: example.html&ui-page=subpageIdentifir. 在&ui-page=前的部分被jquery mobile框架用来向子页面所在的URL发送一个ajax请求.
nonHistorySelectors (string, default: "dialog"):
对于带有data-rel属性值的a标签链接 或者 带有data-role属性值的page,如果它们匹配这些选择器(即该string参数),那么它们不会在历史记录中被追踪 (即它们不会在location.hash中被更新也不会被浏览器历史所标记).
activePageClass (string, default: "ui-page-active"):
该class被分配给当前视图中的page (包括过渡状态中的)
activeBtnClass (string, default: "ui-page-active"):
该class用于"激活"button的状态 (参见css框架).
ajaxEnabled (boolean, default: true):
当可能的时候jQuery Mobile 会自动通过ajax处理链接点击以及表单提交, 如果不行,url hash 监听将会停止,url也会像常规那样发出HTTP 请求.
ajaxLinksEnabled (boolean, default: true):
只要可行的时候,jQuery Mobile 就会自动通过ajax处理链接的点击.
ajaxFormsEnabled (boolean, default: true):
只要可行的时候,jQuery Mobile 就会自动通过ajax处理页面提交.
autoInitialize (boolean, default: true):
当该选项被设置为false时 自动初始化功能将延迟嵌入页面(page)的增强功能直到
$.mobile.initializePage();
被显式调用. 默认情况下当DOM加载完毕page将会被增强.
defaultTransition (string, default: 'slide'):
设置页面过渡效果(ajax请求),设置为'none'表示没有任何过渡效果.
loadingMessage (string, default: "loading"):
设置页面加载时显示的文本. 如果设置为false, 将不会显示任何文本.
metaViewportContent (string, default: "width=device-width, minimum-scale=1, maximum-scale=1"):
配置自动生成的meta标签,如果为false,将不会为DOM添加任何meta标签.
gradeA (函数返回boolean值, default: 该函数默认返回 $.support.mediaquery 的值):
浏览器必须符合所有支持的条件才会返回 true.
$(document).bind("mobileinit", function() {
//$.mobile.loadingMessage = '努力加载中...';
//$.mobile.pageLoadErrorMessage = '找不到对应页面!';
$.extend($.mobile, {
loadingMessage: '努力加载中...',
pageLoadErrorMessage: '找不到对应页面!'
});
});
2.添加自定义方法
//自定义方法
$(document).bind("mobileinit", function() {
$.extend($.mobile, {
gradeA: function() {
//创建一个临时的div元素
var divTmp = document.createElement("div");
//设置元素的内容
divTmp.innerHTML = '<div style="-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);"></div>';
//定义一个初始值
var btnSupport = false;
btnSupport = (divTmp.firstChild.style.webkitTransform != undefined) || (divTmp.firstChild.style.MozTransform != undefined);
return btnSupport;
}
});
});
$(function() {
var strTmp = '浏览器是否为"A"类级别:';
$("#pTip").html(strTmp + $.mobile.gradeA());
})
<div data-role="page">
<div data-role="header">
<h1>头部栏</h1>
</div>
<div data-role="content">
<h3>修改默认配置gradeA的值</h3>
<p id="pTip"></p>
</div>
<div data-role="footer"><h4>©2012 rttop.cn studio</h4></div>
</div>