网上的搜到的好多不能用,最后自己想出了一个方法,
官方easy-ui使用进度条
<div id="p" class="easyui-progressbar" style="width:400px;"></div>
通过这个可以观察页面实际代码
<div id="p" class="easyui-progressbar progressbar" style="width: 118px; height: 20px;" value="90" text="90%">
<div class="progressbar-text" style="width: 118px; height: 20px; line-height: 20px;">90%</div>
<div class="progressbar-value" style="width: 90%; height: 20px; line-height: 20px;">
<div class="progressbar-text" style="width: 118px; height: 20px; line-height: 20px;">90%</div>
</div>
</div>
在datagrid中将自己的数值替换上面的 90即可
我这里传递到页面的是数值,不是百分比
{field: 'status', title: '进度', width: getWidth(0.12), align: 'center', formatter: function (value, rec) { //rec.status*100/4 var tempval=rec.status*100/4; var htmlstr = '<div class="easyui-progressbar progressbar" style="width: 196px; height: 20px;" value="'+tempval +'" text="'+tempval+'%">'+ '<div class="progressbar-text" style="width: 196px; height: 20px; line-height: 20px;">'+tempval+'%</div>'+ '<div class="progressbar-value" style="width: '+tempval+'%; height: 20px; line-height: 20px;">'+ '<div class="progressbar-text" style="width: 196px; height: 20px; line-height: 20px;">'+tempval+'%</div>'+ '</div>'+ '</div>'; return htmlstr; } }