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样式定义的，要改这里的宽度在页面上重写这个样式重写定义宽度即可。

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

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

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

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