1、强制覆盖模版的背景色
.ui-page{
background:#ffffff;
}
说明:这段样式必须放在Jquery Mobile 模版样式的下方,这样才能进行覆盖。
2、禁止截断过长的列表和按钮内容
在jQuery mobile中,如果列表或者按钮中文字的内容过长,jQuery Mobile会自动截断其超过长度的内容。
1)设置按钮样式
.ui-btn-text {
white-space: normal;
}
2)设置列表样式
.ui-li-desc {
white-space: normal;
}
说明:这段样式必须放在Jquery Mobile 模版样式的下方,这样才能进行覆盖。如果不想设置全局的覆盖,那么只要在用到的地方写行内样式。
恢复截断的样式 white-space: nowrap;
3、移除项目列表中a标签的箭头
默认情况下,jQuery Mobile框架会为每一个列表项中带a标签的添加一个箭头,想要禁用箭头显示,需要在想要移除列表项设置data-icon="false"。
4、jQuery mobile 中使用$(document).ready(function() {});问题
由于jQuery mobile框架的影响,所有的链接请求都会被处理成ajax形式的请求,这样依赖document ready只会执行一次。
1)方法1,初始发中配置
$.mobile.ajaxEnabled = false;
2)方法2,用其他监听事件代替,如下所示
$("div[data-role='page']").bind('pageshow',function(event,ui){
// do something
});
5、Jquery Mobile忽略页面中数字为电话号码,因为不这样处理的话,部分数据的样式会受到影响。
<meta content="telephone=no" name="format-detection" />