1.select选项中的值要根据后台取出来的值设置为默认选中状态,比如:
1 | $( '#select-choice-1' ).html( '<option value="' +data.key+ '" selected="selected">' +data.value+ '</option>' ); |
这样页面显示是不会让行option作为选中状态的,要在后面加上一句:
1 | $( '#select-choice-1' ).selectmenu( "refresh" ); |
更新下select状态~
2.复选按钮:
1 | $( "input[type='checkbox']" ).attr( "checked" , true ).checkboxradio( "refresh" ); |
向页面插入复选框后,有时会出现:
1 | Uncaught cannot call methods on checkboxradio prior to initialization; attempted to call method 'refresh' |
这是说没有实例话的意思,可以这样:
1 | $( '#f-list' ).append(html); |
2 | $( "input[type=checkbox]" ).checkboxradio(); |
3 | $( '#f-list' ).checkboxradio( "refresh" ); |
4 | $.mobile.changePage($( "#invite-page" )); |
3.单选按钮组:
1 | $( "input[type='radio']" ).attr( "checked" , true ).checkboxradio( "refresh" ); |
4.滑动条:
1 | $( "input[type=range]" ).val(60).slider( "refresh" ); |
5.开关 (they use slider):
1 | var myswitch = $( "select#bar" ); |
2 | myswitch[0].selectedIndex = 1; |
3 | myswitch .slider( "refresh" ); |
6.可折叠列表(collapsibles):
1 | $( '.selector' ).collapsibleset( 'refresh' ); |
7.样式嵌套(collapsible里嵌套button 或listview里嵌套button):
1 | $( "#msglist" ).html(html).trigger( "pagecreate" ); |
JS插入HTML后加上trigger("pagecreate");
样式嵌套的例子:
js内容:
02 | $( "#primsgview" ).live( "pagebeforecreate" , function (){ |
03 |
$.getJSON(tongxue.website+ "profile/getprivatemsg" , |
07 |
if ( typeof (data) != 'object' ){ |
08 |
html+= '<h3>暂无站内信</h3>' , |
09 |
$( "#msglist" ).html(html); |
11 |
$.each(data, function (Index,msg){ |
13 |
html+= '<div data-role="collapsible" data-theme="c" data-content-theme="c" class="msginfo">' ; |
14 |
html+= '<h3>' +msg.username+ ' 于 ' +msg.sendtime+ '</h3><p> ' +msg.content+ ' </p>' , |
15 |
html+= '<div class="ui-grid-a">' ; |
16 |
html+= ' <div class="ui-block-a">' ; |
17 |
html+= ' <a href="#delmsg" data-rel="dialog" data-role="button" class="delmsg" data-theme="c" id="' +msg.mid+ '">删除</a>' ; |
19 |
html+= ' <div class="ui-block-b">' ; |
20 |
html+= ' <a href="#reply" data-rel="dialog" data-role="button" data-theme="b" id="' +msg.fromid+ '" class="replyname">回复</a>' ; |
21 |
html+= '</div></div></div>' ; |
23 |
$( "#msglist" ).html(html).trigger( "pagecreate" ); |
28 |
$( '#msglist' ).collapsibleset( 'refresh' ); |
30 |
$.mobile.changePage($( "#primsgview" )); |
HTML内容:
1 | <div data-role= "collapsible-set" id= "msglist" > |
转载于:https://blog.51cto.com/jacksongblack/1329094