2

テーブルのセルの.html（）を取得して、data-col属性とdata-row属性のみを知っているjQueryをスローします。これは表です：

<table>
    <tr>
        <td></td>
        <th data-col="A">Mon</th><th data-col="B">Tue</th>
        <th data-col="C">Wen</th>
    </tr>
    <tr>
        <th data-row="1">Mon</th>
        <td>Something</td>
        <td>Something</td>
        <td>Somthing</td>
    </tr>
    <tr>
        <th data-row="2">Mon</th>
        <td>Something</td>
        <td>Something</td>
        <td>Somthing</td>
    </tr>
    <tr>
        <th data-row="3">Mon</th>
        <td>Something</td>
        <td>Something</td>
        <td>Somthing</td>
    </tr>
</table>

このjQueryセレクターを次のように構築する方法がわかりません：$('table>tbody>tr[data-row=2] td')しかし、私は理解できません

ご協力いただきありがとうございます

4

3 に答える 3

2

jsBinデモ

function getTD(col, row){

   var rowIdx = $('[data-row='+row+']').parent('tr').index() ;
   var colIdx = $('[data-col='+col+']').index() -1;

   return $('tr:eq('+rowIdx+') td:eq('+colIdx+')').html() ; 
}

alert(   getTD('A', '2')    );

または、次のようにすることもできます。

デモ

function getTD(c,r) {

  var col = {A:1, B:2, C:3}; // add more if needed

  var colLen = $.map(col, function(n, i) { return i; }).length;
  var cc =  colLen*(r-1) + col[c]; 
  return $('table').find('td').eq(cc).html();

}

alert(   getTD('B', 3)   );

COLの取得にもNumbersを使用した場合、2番目のソリューションの巧妙さははるかに楽しい可能性があります。

function getTD(col,row) {     
  var ind =  (row-1)*3 + col; // 3 is the max N of Cols
  // 'ind' holds the exact index number of our desired TD from our .find() collection
  return $('table').find('td').eq( ind ).html();     
}

// getTD( COL, ROW )
alert(   getTD(2, 3)   );
于 2012-12-24T13:51:54.280 に答える
1

ソリューションの簡単なスケッチ:

// Param table: the <table> DOM element,
// Param col: the string identifying the column,
// Param row: the string identifying the row
function(table, col, row) {
  col_number = $(table).find("tr").first().find("th[data-col=" + col + "]").index(); 
  row_number = $(table).find("th[data-row=" + row + "]").parent().index(); 
  return $(table).find("tr").eq(row_number).find("td").eq(col_number).val();
}

テストされておらず、おそらくさまざまな点でバグがあります。それでも、jQuery ドキュメントの助けを借りれば、一般的な考え方は明確で、簡単に理解できるはずです。

于 2012-12-24T13:39:46.233 に答える
0

colsにインデックスを付ける場合、その解決策はConfusionの答えよりも小さくて速い可能性があります。

/**
 param table - DOM element of table
 param row - row index
 param col - col index
*/
function getData(table, row, col) {
    return $(table).find('tr:nth-child('+(row+1)+')').find('td:nth-child('+(col+1)+')').html();
}

この関数はあなたが必要とするものを作ります。

JSビンデモ

于 2012-12-24T13:50:31.660 に答える