Jquery Mobile 记录

时间:2023-03-09 09:09:05
Jquery Mobile 记录

使用的是C#语言,.Net+Jquery Mobile 框架开发

1.使用水平组切换操作

<fieldset id="Tfdset1" data-role="controlgroup" data-type="horizontal" class="" data-mini="true" style="margin: 0px;">
<input type="radio" name="Tradio_1" id="Tradio11" value="1">
<label for="Tradio11" style="width:40px;text-align:center;">签 到</label>
<input type="radio" name="Tradio_1" id="Tradio21" value="2">
<label for="Tradio21" style="width:40px;text-align:center;">签 退</label>
</fieldset>

设置label的长度等同于设置选项长度

Jquery设置选中:

$("#Pradio21").attr("checked", "checked");
$("input[type='radio']").checkboxradio("refresh");

2.后台登录用到了a标签,出现了 a标签在IE下点击过后出现虚线边框的问题

添加样式 :  a:focus{outline:none;}

3.使用Jquery的Tabs操作指定特定选项卡选中

从左至右,从0开始.

官网详解:http://api.jqueryui.com/tabs/#option-active

$( "#tabs" ).tabs({active: 1});
// Getter
var active = $( "#tabs" ).tabs( "option", "active" );
// Setter
$( "#tabs" ).tabs( "option", "active", 1 );

4.修改jquery mobile 控件的宽度(CSS)等

<select name="flip" id="flip" data-role="slider"  data-mini="true">
<option value="off">未订阅</option>
<option value="on" selected="selected">已订阅</option>
</select>

如:滑块选择的控件,在页面生成的时候会增加一堆标签及样式,这样,需要先找到对应的样式然后重写样式

如下图,select标签添加了 data-role="slider" 属性之后,会变为滑块选择的样子,同时在select中添加div等嵌套标签,这里的宽度就是

在div的class中ui-slider-switch样式定义的,要改这里的宽度在页面上重写这个样式重写定义宽度即可。

Jquery Mobile 记录

5.jquerymobile动态添加元素之后有些不能被正确渲染的解决方法:

$("#对象ID").trigger( "create" );

有些对象提供了refresh 方法,如listview、flip toggle,select
则使用 jq(".detail").listview("refresh");

$("#对象ID").selectmenu("refresh");
这种方式对于动态添加的元素还是无法起作用。