在jquerymobile页面在第一次初始化进行一次整体渲染,动态生成的需要局部渲染。
在jquerymobile实现listview局部渲染的方法:
复制代码 代码如下:
function querypublishorderlist(trackordealorinsp,usercode,type,pagenum){
var querypublishorderlisturl=http://xxx.xxx.xxx.xxx/myapp/workorderselbytypeservice.svc/workordersimpselbytype/json/+trackordealorinsp+/+usercode+/+type+/+pagenum;
$.ajax({
type: 'get',
datatype : json,
url: querypublishorderlisturl,
contenttype: 'application/json',
data: [],
success: function(data) {
var sb = new stringbuffer();
$.each(data, function(i,item){
//创建一个工单列表行对象
sb.append();
sb.append( +item.work_orders_id++i+);
sb.append();
sb.append(工单号:+item.work_orders_id+
);
sb.append(创建人:+item.founder_na+
);
sb.append(创建时间:+item.found_time+
);
sb.append(工单类型:+item.type_na+
);
sb.append(工单内容:+item.work_cont+
);
sb.append();
sb.append();
});
var content = sb.tostring();
$(#querylist).html(content);
},
error:function(xmlhttprequest, textstatus, errorthrown){
alert(请求远程服务错误!);
},
complete: function() {
$(p[data-role=content] ul).listview();
}
});
}
备注:listview针对jquerymobile针对listview组件刷新。
$(p[data-role=content] ul).listview();
如果想针对listview内部的li刷新可以使用
$(p[data-role=content] ul li).listview(refresh);
否则报错误如下:
jquerymobile listviewcannot call methods on listview prior to initialization; attempted to call method 'refresh'
jquerymobile checkbox及时刷新才能获取其准确值
复制代码 代码如下:
一般登录的时候 都有个记住用户名 记住密码 的两个checkbox 多选框
用jquerymobile 做页面 ,当勾选checkbox 时总是不能获取它正确的值。
解决办法:
[code]
$('input[type=checkbox]').bind('click',function() {
$(this).prop('checked').checkboxradio(refresh); // 绑定事件及时更新checkbox的checked值
});
如果要用js去改变checkbox的值时也要及时刷新。
$('input [type=checkbox]').attr('checked',false).checkboxradio(refresh);
$('input [type=checkbox]').attr('checked',false).checkboxradio(refresh);
原因:因为手动改变它的值后,jquerymobile不能重新渲染。 这样页面显示的值和实际值就不一样了。 (jquerymobile 把form表单元素都隐藏起来,然后用 js添加了一些元素易于美化input, select ,textarea 等元素的效果)
[/code]
下拉框刷新
复制代码 代码如下:
$(#selectbox).html(optionlist).selectmenu('refresh', true);
复制代码 代码如下:
复选按钮
$(input[type='checkbox']).attr(checked,true).checkboxradio(refresh);
单选按钮组:
$(input[type='radio']).attr(checked,true).checkboxradio(refresh);
选择列表::
var myselect = $(select#foo);
myselect[0].selectedindex = 3;
myselect.selectmenu(refresh);
滑动条
$(input[type=range]).val(60).slider(refresh);
开关 (they use slider):
var myswitch = $(select#bar);
myswitch[0].selectedindex = 1;
myswitch .slider(refresh);
select 禁用样式
standard: 7 day
rush: 3 days
express: next day
overnight
button禁用样式
