javascript - 親と子を使用してテーブルから値を取得する

Question

以下の表があり、ボタンをクリックすると、最初の3つからコンテンツを取得し<td>て配列に入れたいと思います。親と子を何らかの方法で使用できると考えましたが、最終結果を得るのに問題があります。表の下に、これまでのコードを示します。

<tr>
    <td>Content A</td>
    <td>Content B</td>
    <td>Content C</td>
    <td>
        <Button id="delete">Delete</Button>
    </td>
</tr>

現在の Jquery/Javascript:

$('#delete').on( "click", function( event ) {
    $(event.target).closest( 'tr' ).remove();
    var unit = $(event.target).parent().children().get(0);
    alert(unit);  //returns html element 
});

私が望む最終出力は、配列です["Content A","Content B","Content C"]

Answer 1

次のようなことができます。

JS

$('#delete').on("click", function (event) {
    var _this = $(event.target);
    var tds = $(_this).closest("tr").find("td:lt(3)");
    var outArray = [];
    for(var x = 0; x < tds.length; x++){
        outArray.push($(tds[x]).text());   
    }
    alert(outArray.join(","));
});

フィドル

http://jsfiddle.net/uYR6A/1/

Answer 2

試す

$('#delete').on( "click", function( event ) {
    $(event.target).closest( 'tr' ).remove();
    var data = [];
    $(event.target).parent().siblings("td").each(function() {
        data.push($(this).html())
    });
    console.log(data);  //returns html element 
});

フィドル

Answer 3

$('#delete').on( "click", function( event ) {
   var obj = $(this).parent().parent();
   $(obj).each(function(){
   alert($(this).html()) ;
   });
});