快捷導(dǎo)航

JS選中checkbox后獲取table內(nèi)一行TD所有數(shù)據(jù)的方法

更新時(shí)間：2015年07月01日 15:51:10 作者：言會(huì)咸

這篇文章主要介紹了JS選中checkbox后獲取table內(nèi)一行TD所有數(shù)據(jù)的方法,涉及javascript針對(duì)table元素遍歷與獲取的技巧,需要的朋友可以參考下

本文實(shí)例講述了JS選中checkbox后獲取table內(nèi)一行TD所有數(shù)據(jù)的方法。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<html> 
<head> 
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
 <title>Untitled</title> 
 <script> 
  function test(o) { 
   if (!o.checked) { 
    return; 
   } 
   var tr = o.parentNode.parentNode; 
   var tds = tr.cells; 
   var str = "you click "; 
   for(var i = 0;i < tds.length;i++){ 
    if (i < 3) { 
     str = str + tds[i].innerHTML + "--"; 
    } 
   } 
   alert(str); 
  } 
 </script> 
</head> 
<body> 
<table width="60%" cellspacing="0" cellpadding="0" align="left" border="1" bordercolordark="#ffffff" bordercolorlight="#B3B5B4" > 
 <tbody id="tabstore1"> 
  <tr> 
   <td>b1</td> 
   <td>b2</td> 
   <td>b3</td> 
   <td><input type="checkbox" onclick="test(this);"/></td> 
  </tr> 
  <tr> 
   <td>c1</td> 
   <td>c2</td> 
   <td>c3</td> 
   <td><input type="checkbox" onclick="test(this);"/></td> 
  </tr> 
 </tbody> 
</table> 
</body> 
</html>

希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

requireJS模塊化實(shí)現(xiàn)返回頂部功能的方法詳解
這篇文章主要介紹了requireJS模塊化實(shí)現(xiàn)返回頂部功能的方法,結(jié)合實(shí)例形式詳細(xì)分析了requireJS的使用步驟及返回頂部功能的相關(guān)操作技巧,需要的朋友可以參考下
2017-10-10
JavaScript基于對(duì)象去除數(shù)組重復(fù)項(xiàng)的方法
這篇文章主要介紹了JavaScript基于對(duì)象去除數(shù)組重復(fù)項(xiàng)的方法,結(jié)合實(shí)例形式分析了javascript數(shù)組去重的操作步驟與具體實(shí)現(xiàn)技巧,需要的朋友可以參考下
2016-10-10
淺談JavaScript節(jié)流與防抖
這篇文章主要為大家介紹了JavaScript的節(jié)流與防抖，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來(lái)幫助
2021-11-11
完美解決mui框架off-canvas側(cè)滑超出部分隱藏?zé)o法滾動(dòng)的問(wèn)題
下面小編就為大家分享一篇完美解決mui框架off-canvas側(cè)滑超出部分隱藏?zé)o法滾動(dòng)的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2018-01-01
JS請(qǐng)求servlet功能示例
這篇文章主要介紹了JS請(qǐng)求servlet功能,結(jié)合具體實(shí)例形式分析了javascript使用ajax請(qǐng)求servlet端響應(yīng)的主要功能代碼與相關(guān)操作技巧,需要的朋友可以參考下
2017-06-06
微信小程序?qū)崿F(xiàn)傳參數(shù)的幾種方法示例
這篇文章主要給大家介紹了關(guān)于微信小程序?qū)崿F(xiàn)傳參數(shù)的幾種方法，分別是navigator跳轉(zhuǎn)時(shí)、全局變量、列表index下標(biāo)取值以及form表單傳值的相關(guān)內(nèi)容，需要的朋友可以參考借鑒，下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧。
2018-01-01
bootstrap paginator分頁(yè)插件的兩種使用方式實(shí)例詳解
Bootstrap Paginator是一款基于Bootstrap的js分頁(yè)插件，下面通過(guò)本文給大家介紹bootstrap paginator分頁(yè)插件的兩種使用方式，一起看看吧
2017-11-11
A標(biāo)簽觸發(fā)onclick事件而不跳轉(zhuǎn)的多種解決方法
一個(gè)標(biāo)簽僅僅是要觸發(fā)onclick行為，遇到了A標(biāo)簽觸發(fā)onclick事件時(shí)不執(zhí)行跳轉(zhuǎn)，下面與大家分享下四種解決方法，感興趣的朋友可以參考下哈
2013-06-06
javascript數(shù)組常見(jiàn)操作方法實(shí)例總結(jié)【連接、添加、刪除、去重、排序等】
這篇文章主要介紹了javascript數(shù)組常見(jiàn)操作方法,結(jié)合實(shí)例形式總結(jié)分析了javascript數(shù)組的連接、添加、刪除、去重、排序等操作,代碼注釋附帶較為詳細(xì)的說(shuō)明,需要的朋友可以參考下
2019-06-06
微信小程序?qū)崿F(xiàn)圖片選擇并預(yù)覽功能
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)圖片選擇并預(yù)覽，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2019-07-07