首页 > 代码库 > underscore.js,js工具库
underscore.js,js工具库
官方文档:http://underscorejs.org/
var totalCheckPriceVal = _.reduce(tableData[0],function(memo,num){
var memoint=memo-0;
var numint=num-0;
return memoint+numint; },0
)
_.reduce()
计算一个数组里所有值相加
var selectProdutData = http://www.mamicode.com/_.indexBy(prodcutList,function(obj){
return obj.originalProductCode+obj.stationCode+obj.orderNumber;
});
._indexBy()
返回一个key-value形式的js对象可用于添加商品业务逻辑的实现;
_.map(productsData,function(product){
var objNegative={};
if((product.confirmedNumber-0)<=0){
isNegative=true;
objNegative.originalProductCode=product.originalProductCode;
objNegative.stationCode=product.stationCode;
objNegative.orderNumber=product.orderNumber;
arrayNegative.push(objNegative);
}
})
._map()
一个遍历函数;
遍历的时候遇到异步执行的函数会同步执行;
使用underscore制作一个打印分页html
<!doctype html><head><title></title><script src="http://www.mamicode.com/jquery.js"></script><script src="http://www.mamicode.com/underscore-min.js"></script><style type="text/css"> *{padding: 0;margin:0;} table{border-collapse:collapse;border: 1px solid #000000;border-spacing:0;width: 100%;text-align: left;margin-top: 10px;} table td,table th{padding: 0 3px;height: 19px;line-height: 15.5px;border: 1px solid #000;} body{padding: 5px;font-size: 12px;} ul{list-style-type: none;font-size: 0;position: relative;} ul li{display: inline-block;width: 50%;font-size: 12px;margin: 10px 0;} ul li.op{position: absolute;right: 100px;top: 15px;width: 80px;} td.title{text-align: left;width: 100px;} tr.blank{height: 17px;border: 1px solid #fff;} #print{padding-right: 15px;position: relative;} .pageer{position: absolute;right: 0px;display:none;top:0;color: #000000;font-size: 14px;} @media print { .paging {page-break-after:always;} .page{display:inline-block;right: -5px;} } #list{margin: 15px 0;} #list th{text-align: center;} .mouth{ -ms-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -o-transform: rotate(-90deg); } .ie8mouth{ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); } </style> <script id="teml" type="text/template"> <div style="width:100%" align="center"><font size="6">服务商送货任务单</font></div> <div id="print" class=‘paging‘> <table> <tbody><tr> <td rowspan="6" style="text-align:center;border-bottom: 0px;"> <p class="mouth">商</p><p class="mouth">务</p><p class="mouth">服</p><p class="mouth">:</p><p class="mouth">联</p><p class="mouth">色</p><p class="mouth">白</p> </td> <td class="title" colspan="2">原厂订单编号</td> <td colspan="2"><%= productdescripe[0].orderCode %></td> <td class="title" colspan="2">厂商品牌</td> <td colspan="2"><%= productdescripe[0].brand %></td> </tr> <tr> <td class="title" colspan="2">配送任务单号</td> <td colspan="2"><%= productdescripe[0].taskCode %></td> <td class="title" colspan="2">订单创建日期</td> <td colspan="2"><%= productdescripe[0].createTime %></td> </tr> <tr> <td class="title" colspan="2">站点名称</td> <td colspan="2"><%= productdescripe[0].stationName %></td> <td class="title" colspan="2">ASC代码</td> <td colspan="2"><%= productdescripe[0].ascCode %></td> </tr> <tr> <td class="title" colspan="2">站点联系人</td> <td colspan="2"><%= productdescripe[0].stationPerson %></td> <td class="title" colspan="2">站点电话</td> <td colspan="2"><%= productdescripe[0].stationPhone %></td> </tr> <tr> <td class="title" colspan="2">站点送货地址</td> <td colspan="2"><%= productdescripe[0].stationAddress %></td> <td class="title" colspan="2">原厂订单日期</td> <td colspan="2"><%= productdescripe[0].orderTime %></td> </tr> <tr> <td class="title" colspan="2">服务商名称</td> <td colspan="2"><%= productdescripe[0].serviceName %></td> <td class="title" colspan="2">服务商编号</td> <td colspan="2"><%= productdescripe[0].serviceNumber %></td> </tr> <tr> <td rowspan="31" style="text-align:center;border-bottom: 0px;border-top: 0px;" id="datalist"> <!-- 上海通用雪佛兰 --> <p class="mouth"> 兰 </p> <p class="mouth"> 佛 </p> <p class="mouth"> 雪 </p> <p class="mouth"> 用 </p> <p class="mouth"> 通 </p> <p class="mouth"> 海 </p> <p class="mouth"> 上 </p> <p class="mouth">:</p><p class="mouth">联</p><p class="mouth">色</p><p class="mouth">蓝</p> <p class="mouth"> </p> <p class="mouth"> </p> <p class="mouth"> </p> <p class="mouth"> </p> <p class="mouth"> </p> <p class="mouth"> </p> <p class="mouth">O</p><p class="mouth">Z</p><p class="mouth">K</p><p class="mouth">A</p> <p class="mouth">:</p><p class="mouth">联</p><p class="mouth">色</p><p class="mouth">红</p> <p class="mouth"> </p> <p class="mouth"> </p> <p class="mouth"> </p> <p class="mouth"> </p> <p class="mouth">理</p><p class="mouth">代</p><p class="mouth">总</p> <p class="mouth">:</p><p class="mouth">联</p><p class="mouth">色</p><p class="mouth">绿</p> </td> <td class="title" colspan="2">服务商联系人</td> <td colspan="2"><%= productdescripe[0].servicePerson %> </td> <td class="title" colspan="2"><%= productdescripe[0].servicePhone %></td> <td colspan="2">13301607008</td> </tr> <tr> <td style="text-align: right">序号</td> <td>配件号</td> <td colspan="2">配件名称</td> <td colspan="2">订购数量(罐)</td> <td colspan="2">实收数量(罐)</td> </tr> <!--startprint--> <% for(var i = 0; i < 29; i++) { %> <% var item = list[i]; if(item){%> <tr><td>1</td> <td><%= item.code %> </td> <td colspan="2"><%= item.name %></td> <td colspan="2"><%= item.ordercount %></td> <td colspan="2"><%= item.receiptcount %></td> </tr> <%} else{%> <tr><td></td> <td></td> <td colspan="2"></td> <td colspan="2"></td> <td colspan="2"></td> </tr> <%}%> <% } %> <tr> <td rowspan="5" style="text-align:center;border-top: 0px;"> <p class="mouth">点</p><p class="mouth">站</p><p class="mouth">C</p><p class="mouth">S</p><p class="mouth">A</p> <p class="mouth">:</p><p class="mouth">联</p><p class="mouth">色</p><p class="mouth">黄</p><p class="mouth"> </p> </td> <td></td> <td></td> <td colspan="2"></td> <td colspan="2"></td> <td></td> </tr> <tr><td>合计</td> <td></td> <td colspan="2"></td> <td colspan="2" class="ordercount"></td> <td colspan="2" class="receiptcount"></td></tr> <tr> <td colspan="2"></td> <td colspan="2"></td> <td colspan="2"></td> <td colspan="2"></td> </tr> <tr> <td colspan="2">送货人</td> <td colspan="2">收件人</td> <td colspan="2" style="text-align:center">盖章</td> <td colspan="2"></td> </tr> <tr> <td colspan="2">送货时间</td> <td colspan="2">收货时间</td> <td colspan="2"></td> <td colspan="2"> </td> </tr> </tbody></table> </div> </script></head><body> </body><script type="text/javascript">var data=http://www.mamicode.com/{ "P2200391160401000", taskCode:"AKS16041515441113922", stationName:"上海九炫汽车销售服务有限公司", stationPerson:"test", stationAddress:"上海奉贤区南亭公路1269号", serviceName:"上海光环工贸有限公司", servicePerson:"姜宏伟 ", brand:"上海通用雪佛兰", createTime:"2016-4-15 15:44:11", ascCode:"2200391", stationPhone:"22222", orderTime:"2016-04-15", serviceNumber:"107131", servicePhone:"13301607008" }], list: [ {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"7",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"4",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"5",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"6",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, {code: "YQ-9850918",name:"新劲7号底色漆 MM Q271 1升",ordercount:"8",receiptcount:"7"}, ] }; var arr=data.list;var ordercountlist=_.pluck(arr, ‘ordercount‘);var ordercountsum = _.reduce(ordercountlist, function(memo, num){ return parseInt(memo) + parseInt(num); }, 0);var length=arr.length;var render = _.template($(‘#teml‘).html());var html = render(data);$("body").html(html);var page=parseInt(length/29)+1;for(j=1;j<page;j++){ arr.splice(0,29*j); var render = _.template($(‘#teml‘).html()); var html = render(data); $("body").append(html);}$("table").last().parent().removeClass("paging");$("td[class=ordercount]").last().html(ordercountsum)</script></html>
underscore.js,js工具库