使用的是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");
这种方式对于动态添加的元素还是无法起作用。