欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

用Jquery選擇器計算table中的某一列某一行的合計

 更新時間:2014年08月13日 17:17:49   投稿:whsnow  
本節(jié)主要介紹了用Jquery選擇器計算table中的某一列某一行的合計,需要的朋友可以參考下

利用Jquery選擇器,計算table中的某一列,某一行的合計,非常方便。下面以計算行合計為例:

核心算法:

$('#tableId tr').each(function() { 
$(this).find('td:eq(columnIndex)').each(function() { 
totalAmount += parseFloat($(this).text());
})
});

下面是案例代碼

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Jquery計算table行合計</title> 
<script id="jquery_183" type="text/javascript" class="library" src="http://runjs.cn/js/sandbox/jquery/jquery-1.8.3.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 

var totalRow = 0 
$('#mytable tr').each(function() { 
$(this).find('td:eq(2)').each(function(){ 
totalRow += parseFloat($(this).text()); 
}); 
}); 

$('#totalRow').append('<td>合計</td><td></td><td>'+totalRow+'</td><td></td>'); 
}); 
</script> 

</head> 
<body style="width:100%; height:100%;"> 
<table id="mytable" border="1" width="37%"> 
<thead> 
</thead> 
<tr> 
<td width="63" >11</td> 
<td width="68" >12</td> 
<td width="62" >13</td> 
<td width="75" >14</td> 
</tr> 
<tr> 
<td width="63" >21</td> 
<td width="68" >22</td> 
<td width="62" >23</td> 
<td width="75" >24</td> 
</tr> 
<tr id="totalRow"></tr> 
</table> 
</body> 
</html>

效果圖:

相關文章

  • 13個絢麗的Jquery 界面設計網站推薦

    13個絢麗的Jquery 界面設計網站推薦

    今天共享一些令人振奮的UI教程,這些UI大部分是基于Jquery的插件,主要包括動態(tài)切換視圖的相冊、3D旋轉分享按鈕、Facebook admin Panel,下滑效果的導航Menu,滑翔購物車功能,漂亮的Form表單元素等等。
    2010-09-09
  • jquery插件qrcode在線生成二維碼

    jquery插件qrcode在線生成二維碼

    jquery.qrcode是一個強大的jquery的插件,可以用來二維碼圖形的渲染,用于生成二維碼,非常的實用,需要的朋友參考下。
    2015-04-04
  • Jquery中使用setInterval和setTimeout的方法

    Jquery中使用setInterval和setTimeout的方法

    有時候需要在jquery中調用setInterval和setTimeout,直接在ready中調用其他方法,會提示缺少對象的錯誤,解決方法如下
    2013-04-04
  • jquery JSON的解析方式示例介紹

    jquery JSON的解析方式示例介紹

    這里以jquery異步獲取的數據類型——json對象和字符串為依據,分別介紹兩種方式獲取到的結果處理方式
    2014-07-07
  • jQuery實現移動端下拉展現新的內容回彈動畫

    jQuery實現移動端下拉展現新的內容回彈動畫

    這篇文章主要介紹了jQuery實現移動端下拉展現新的內容回彈動畫,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2020-06-06
  • jquery圖片輪播插件仿支付寶2013版全屏圖片幻燈片

    jquery圖片輪播插件仿支付寶2013版全屏圖片幻燈片

    這篇文章主要介紹了jquery圖片輪播插件,仿支付寶2013版全屏圖片幻燈片功能,需要的朋友可以參考下
    2014-04-04
  • jquery+ajax實現跨域請求的方法

    jquery+ajax實現跨域請求的方法

    這篇文章主要介紹了jquery+ajax實現跨域請求的方法,詳細介紹了前臺及后臺的處理方法,是非常實用的技巧,需要的朋友可以參考下
    2015-01-01
  • jquery ajax后臺返回list,前臺用jquery遍歷list的實現

    jquery ajax后臺返回list,前臺用jquery遍歷list的實現

    下面小編就為大家?guī)硪黄猨query ajax后臺返回list,前臺用jquery遍歷list的實現。小編覺得挺不錯的,現在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2016-10-10
  • jQuery實現用戶注冊的表單驗證示例

    jQuery實現用戶注冊的表單驗證示例

    用戶注冊的表單往往是需要進行驗證的,否則會有一些不否合規(guī)則的數據入庫,后果會不堪設想,下面為大家詳細介紹下通過jquery是如何實現的,下面有個示例,感興趣的朋友可以參考下
    2013-08-08
  • jquery HotKeys輕松搞定鍵盤事件代碼

    jquery HotKeys輕松搞定鍵盤事件代碼

    今天發(fā)現HotKeys插件的功能真的很強大,且使用簡單,以后再也不用考慮鍵值的問題了,自己定義每個鍵的函數就行了
    2008-08-08

最新評論