2012-02-24 10 views
2

私は、類似しているが正確に同じではない特定の質問を見たことがあり、私はこの問題で困惑している。jQuery複数のテーブル列をインデックスで選択する

私がしようとしているのは、テーブルをとり、テーブルのtd要素を通り、カーソル:ポインタ(今のところ)を設定しますが、許可するポインタだけを設定するウィジェットを作成することです。

これは私のコードがどのように見えるかです:

selectableGrid: function (options) { 
      var indexes = options.columns // this is [1,2]; 

      return this.each(function() { 
       // Make the td's in the grid selectable 
       $(this).find("tbody td").attr("style", "cursor:pointer"); 
      }); 
     } 

私が達成したいと思っています最終的な結果? (私はとにかく試した限り)私は列の私の配列リストに1,3を通じて送信することができ念頭に

<tbody> 
    <td>hello</td> // index 0 
    <td style="cursor:pointer">hello</td> //index 1 
    <td style="cursor:pointer">hello</td> // index 2 
</tbody> 

ベアを、そうLTとGTは私のシナリオでは動作しません。

EDIT: は、これを達成するために、私は次のコードと一緒に行きました:それが唯一の最初の反復を参照されるように、いくつかの理由「TBODYのTD」の場合

$(this).find("tr").each(function() { 
     $(this).find("td").each(function (i, el) { 
       if (indexes.indexOf(i) > -1) { 
        $(this).css("cursor", "pointer"); 
       }; 
     }); 
}); 

は、特異ループのために動作しないでしょうタグ。

ありがとうございましたStack Overflow。

+1

代わりに '.ATTR( "スタイル"、 "カーソル:ポインタ")の;'あなたがすべき'.css(" cursor "、" pointer ");' '.attr'を使うと既存のインラインスタイルを上書きします。 – Blazemonger

+0

小さなチップをありがとう - 私のコードを変更しました! –

答えて

1

.each .....あなたのコードで参照することができindexパラメータを取ります。

var indexes = options.columns; 
this.find("tbody td").each(function(i, el) { 
    if ($.inArray(i,indexes)>-1) { // good idea, ggreiner 
     $(this).css("cursor","pointer"); 
    }; 
}); 
+0

ちょっとした変更を加えなければならなかったが、ありがとう。 –

+0

これは、テーブルに1つの行がある場合にのみ機能します。そして、私は['inArray'](http://api.jquery.com/jQuery.inArray/)のパラメータの順番は後方 – ggreiner

+0

@ggreinerなので、もう一度ありがとうと思います。 – Blazemonger

1

インデックスをループし、特定のtdを見つけるためにhttp://api.jquery.com/eq/を使用してください。

+0

私はこのアプローチを試してみたところ、$(this).find( "tbody td")。eq(value).css( "style"、 "cursor:pointer");ここで、value =インデックス(1,2)です。 –

2

要素をループし、兄弟に関するインデックスがoptions.columns配列に含まれるインデックスであることを確認します。

selectableGrid: function (options) { 
    var indexes = options.columns // this is [1,2]; 
    return this.each(function() { 
     $(this).find("tbody td").each(function(){ 
      var columnIndex = $(this).index(); 
      if($.inArray(columnIndex, options.columns) != -1){ 
       $(this).css("cursor", "pointer"); 
      } 
     }); 
    }); 
} 
+0

+1 forArray! –