<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>无标题文档</title><style>ul{ list-style:none;}.table-body li{line-height:60px; height:60px; overflow:hidden; position:relative;}/*进度条 */.barAll{position:absolute; top:18px; left:598px; color:#cbdbe6;}.barnum-1{width:870px;}.barnum-2{ width:1072px;}.progress{ position:relative; height:24px; background-color:#cbdbe6; line-height:24px;}#progress-bar{line-height:24px;text-align:right; background-color:#ffb74d;-webkit-transition:all .3s; color:#eaeaea;}.progress-lbar{position:absolute; right:-64px; top:0; color:#acacac;}</style></head><body><ul class="table-body" id="tableBody"> <li> <span class="numAll num">1</span> <div class="barAll barnum-1"> <div class="progress"> <div id="progress-bar"><span class="progress-sbar" id="progress-sbar">485,931</span></div> <span class="progress-lbar" id="progress-lbar">800000</span> </div> </div> </li> <li> <span class="numAll num">2</span> <div class="barAll barnum-2"> <div class="progress"> <div id="progress-bar"><span class="progress-sbar" id="progress-sbar">409,280</span></div> <span class="progress-lbar" id="progress-lbar">2,400,000</span> </div> </div> </li></ul><script src="https://code.jquery.com/jquery-1.12.4.min.js"></script><script>$(function(){ var str1=$('#progress-sbar').text(), arr1= str1.split(","), strNew1=parseInt(arr1.join("")); var str2=$('#progress-lbar').text(), arr2= str2.split(","), strNew2=parseInt(arr2.join("")); var c = ((strNew1/strNew2)*100).toFixed(2)+'%'; $('li').each(function(index){ $('li #progress-bar').eq(index).css('width',c); }) })</script></body></html>
1 回答
已采纳
joffyzou
TA贡献45条经验 获得超17个赞
首先，你的代码太乱了，一个ID只能命名一次。
$('li').each(function(index){
var str1 = $(this).find('.progress-sbar').text();
var arr1 = str1.split(",");
var strNew1 = parseInt(arr1.join(""));
var str2 = $(this).find('.progress-lbar').text();
var arr2 = str2.split(",");
var strNew2 = parseInt(arr2.join(""));
var c = ((strNew1/strNew2)*100).toFixed(2)+'%';
$('li .progress-sbar').eq(index).css('width',c);
})- 1 回答
- 0 关注
- 1287 浏览
添加回答
举报
0/150
提交
取消