夏日博客

A-A+

jQuery 动态添加与统计 实现代码

2016年01月07日 前端设计 暂无评论 阅读 6 views 次

jquery 动态添加与统计 实现代码

(一)创建克隆单元格对象并添加到表格中

  1. var v=$("#tbin");//得到表格的jquery对象         
  2. //所有的数据行有一个.myrow的class,得到数据行的大小  
  3. var vcount=$("#tbin tr").filter(".myrow").size()+1;//表格有多少个数据行   
  4. var vtr=$("#tbin #trdatarow1"); //得到表格中的第一行数据           
  5. var vtrclone=vtr.clone(true);//创建第一行的副本对象vtrclone  
  6.    vtrclone.appendto(v);//把副本单元格对象添加到表格下方  

(三)计费重量变化时计算费用,并统计总费用

  1.   $("#txtmoneyweight").bind("change", function()  
  2.         {  
  3.         var vtotalmoney=0;//总金额的初始值为0;          
  4.         var vtxtdetail=$(this);//得到变化的文本框对象      
  5.         var vval=vtxtdetail.val();             
  6. var vtxtafter=vtxtdetail.parent("td").parent("tr").find("#txtrate");//得到费率;  
  7. var vtxtmoney=vtxtdetail.parent("td").parent("tr").find("#txtmoney");//得到费用;    
  8.    var vmoney=calculatormoney(vval,vtxtafter.val());//使用公式计算单行运费  
  9.    vtxtmoney.val(vmoney); //显示单行运费信息            
  10.     updatetotal();   //调用函数统计更新总费用  
  11.          
  12.         }); //变化脚本结束  

(二)统计更新总金额

  1. function updatetotal()//更新总金额  
  2.       {  
  3.         var vtotalmoney=0;//总金额的初始值为0;                
  4.         var vtable=$("#tbin");//得到表格的jquery对象     
  5.         var vtotal= vtable.find("#txttotal") ;//得到总金额对象  
  6.         var vtxtafters=vtable.find("#txtmoney");//得到所有计算好的费用对象;  
  7.         vtxtafters.each(   //使用jquery的each函数遍历每行费用对象,累加成总金额  
  8.             function(i)  
  9.             {  
  10.             var vtempvalue=$(this).val();  
  11.                 if(vtempvalue=="")  
  12.                 {  
  13.                     vtempvalue=0;  
  14.                 }  
  15.             vtotalmoney=vtotalmoney+parsefloat(vtempvalue);//计算总费用  
  16.             }  
  17.         )//遍历结束  
  18.          vtotal.val(vtotalmoney); //将总费用显示到对应文本框对象中  
  19.       }  
标签：

给我留言