jQuery獲取Table某列的值（推薦）

更新時(shí)間：2017年03月03日 14:03:04 作者：Insus.NET

這篇文章主要介紹了jQuery獲取Table某列的值,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下

在寫此篇博文時(shí)，發(fā)現(xiàn)在以前曾寫過《獲取DataTable選擇第一行某一列值》http://www.cnblogs.com/insus/p/5434062.html 。

但是與此篇所說的完全不一樣。這篇Insus.NET需要的是jQuery去獲取html table的某一行某一列的數(shù)據(jù)。

如下表：

Html code:

<table>
    <tr>
      <th style="width:10px;"><input id="SelectAll" type="checkbox" /></th>
      <th>ID</th>
      <th>費(fèi)用名目</th>
      <th>費(fèi)用解釋</th>
      <th>收費(fèi)明細(xì)</th>
      <th>幣種</th>
      <th style="width:50px;">操作</th>
    </tr>
    @foreach (var m in new HighwayAdditionalChargeEntity().HighwayAdditionalCharges())
      {
      <tr class="trData">
        <td><input id="" class="SelectSingle" type="checkbox" value="@m.HighwayAdditionalCharge_nbr" /></td>
        <td>@m.HighwayAdditionalCharge_nbr</td>
        <td>@m.Item</td>
        <td>@m.Description</td>
        <td>@m.Itemizations</td>
        <td>@m.Currency</td>
        <td>
          <input class="Select" id="ButtonSelect" type="button" value="選擇" />
        </td>
      </tr>
    }
  </table>

當(dāng)用戶點(diǎn)擊某一行最后一列的“選擇”銨鈕時(shí)，想獲取此銨鈕本行中某一列的數(shù)據(jù)。

Insus.NET有在圖中示出，列與索引。索引是從0開始。如想獲取“費(fèi)用名目”列值，此列的列索引是2。

演示：

上面我們獲取值，是使用了.text()方法。但某一時(shí)候，你想獲取列的值，它是html代碼，那我們可以使用.html()方法。下面Insus.NET稍修改一下：

演示：

其實(shí)，使用索引來獲取值，只是一種方法，但它不是Insus.NET最理想的方法首選。由于數(shù)據(jù)行是動(dòng)態(tài)呈現(xiàn)，列也有可能會(huì)變更。因此Insus.NET還是習(xí)慣使用樣式class來實(shí)現(xiàn)：

舉個(gè)列子，想獲取“費(fèi)用解釋”列的值，在此列添加一個(gè)class:

jQuery代碼：

演示：

以上所述是小編給大家介紹的jQuery獲取Table某列的值，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

相關(guān)文章

jQuery 菜單隨滾條改為以定位方式(固定要瀏覽器頂部)
在淘寶購物的時(shí)候，發(fā)現(xiàn)里面有一個(gè)菜單，是查看“評(píng)論，物品信息”等的一個(gè)菜單。由于頁面太長(zhǎng)，所以它做了一個(gè)菜單定位
2012-05-05
jQuery實(shí)現(xiàn)checkbox全選功能完整實(shí)例
這篇文章主要介紹了jQuery實(shí)現(xiàn)checkbox全選功能,結(jié)合完整實(shí)例形式分析了jQuery事件響應(yīng)及頁面元素屬性動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下
2018-07-07
使用jQuery實(shí)現(xiàn)input數(shù)值增量和減量的方法
這篇文章主要介紹了使用jQuery實(shí)現(xiàn)input數(shù)值增量和減量的方法,實(shí)例分析了Bootstrap TouchSpin插件的用法,是非常實(shí)用的技巧,需要的朋友可以參考下
2015-01-01
JQuery 國際象棋棋盤實(shí)現(xiàn)代碼
前些時(shí)候?yàn)榱耸煜H象棋的各種開局，隨手寫了一個(gè)很簡(jiǎn)單的國際象棋棋盤（實(shí)在找不到現(xiàn)成的）。
2009-06-06
jQuery使用contains過濾器實(shí)現(xiàn)精確匹配方法詳解
這篇文章主要介紹了jQuery使用contains過濾器實(shí)現(xiàn)精確匹配的方法,結(jié)合實(shí)例形式分析了contains過濾器的具體使用技巧,需要的朋友可以參考下
2016-02-02
jQuery僅用3行代碼實(shí)現(xiàn)的顯示與隱藏功能完整實(shí)例
這篇文章主要介紹了jQuery僅用3行代碼實(shí)現(xiàn)的顯示與隱藏功能,以完整實(shí)例形式分析了jQuery實(shí)現(xiàn)鼠標(biāo)響應(yīng)及頁面元素屬性變換的相關(guān)技巧,需要的朋友可以參考下
2015-10-10
jquery 插件實(shí)現(xiàn)多行文本框[textarea]自動(dòng)高度
這篇文章主要介紹了jquery 插件實(shí)現(xiàn)多行文本框[textarea]自動(dòng)高度,需要的朋友可以參考下
2015-03-03
jQuery實(shí)現(xiàn)的無限級(jí)下拉菜單功能示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的無限級(jí)下拉菜單,涉及jQuery事件響應(yīng)及頁面元素屬性動(dòng)態(tài)變換相關(guān)操作技巧,需要的朋友可以參考下
2016-09-09
jquery中ajax學(xué)習(xí)筆記3
由于很多知識(shí)都已經(jīng)做了詳細(xì)介紹，本節(jié)只介紹需要修改的代碼，使用jqery封裝的ajax使用XML格式接收服務(wù)器端的數(shù)據(jù)，web.xml、后臺(tái)的servet都不用改
2011-10-10
基于jQuery的輸入框無值自動(dòng)顯示指定數(shù)據(jù)的實(shí)現(xiàn)代碼
在自己的網(wǎng)頁中，常常要實(shí)現(xiàn)指定樣式的輸入框，當(dāng)輸入框中沒有輸入或只輸入空格等無效信息時(shí)，自動(dòng)顯示指定的文本，以提醒用戶應(yīng)該如何操作，下面是具體實(shí)現(xiàn)方法，僅供參考。
2011-01-01