2017-07-03 4 views
0

Jquery FYIを初めて使用しました。私は自分のコンソールに表示するために私のテーブル内のすべてのテーブルのデータを取得しようとしているが、それは動作しません。すべての表の行を選択してすべての表のデータを検索し、そのコンソールのログを記録しますが、それは機能しません。いくつかの説明が役に立ちます!テーブル内のすべてのテーブルデータをJqueryで選択

$(document).ready(function() { 
 
    $('#divTable td').each(function(){ 
 
     var tableData = $(this); 
 
     console.log($(tableData).val()); 
 

 
    }); 
 

 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="myContent"> 
 
    <p>My Jquery enabled page</p> 
 
</div> 
 
<br> 
 
<div id="divTable"> 
 
    <table> 
 
    <tr> 
 
     <!--table heading--> 
 
     <th>Company</th> 
 
     <th>Contact</th> 
 
     <th>Country</th> 
 
    </tr> 
 
    <tr> 
 
     <td>Alfreds Futterkiste</td> 
 
     <td>Maria Anders</td> 
 
     <td>Germany</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Centro comercial Moctezuma</td> 
 
     <td>Francisco Chang</td> 
 
     <td>Mexico</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Ernst Handel</td> 
 
     <td>Roland Mendel</td> 
 
     <td>Austria</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Island Trading</td> 
 
     <td>Helen Bennett</td> 
 
     <td>UK</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Laughing Bacchus Winecellars</td> 
 
     <td>Yoshi Tannamuri</td> 
 
     <td>Canada</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Magazzini Alimentari Riuniti</td> 
 
     <td>Giovanni Rovelli</td> 
 
     <td>Italy</td> 
 
    </tr> 
 
    </table> 
 
</div>

+0

' '情報:tr''? – j08691

+0

セレクタを使用してtableDataを取得する必要はありません。 – hasan

+1

の代わりに "console.log(tableData.val())"を使用し、val()関数は入力のデータを取得するためにval()タグ – hasan

答えて

1

あなたは<tr>要素を反復処理しようとしている場合、それは同じことを行うべきであるあなたが<td>要素を通して行ったようだった - :なし、です。 <td>要素が常に<tr>タグ内になるよう<tr>要素をループ言われていること

は、本当に必要はありません。外側の each()は単に取り外すことができます。

私が変更したい最後のもの:セルオブジェクト自体ではなく、セル内にテキストを入れたいと思うときは、それぞれ<td>をjQuery要素としてログに記録しています。私は例として.text()を追加しました。

$(document).ready(function() { 
 
    $(this).find('td').each(function() { 
 
     var tableData = $(this).text(); 
 
     console.log(tableData); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="myContent"> 
 
    <p>My Jquery enabled page</p> 
 
</div> 
 
<br> 
 
<div id="divTable"> 
 
    <table> 
 
    <tr> 
 
     <!--table heading--> 
 
     <th>Company</th> 
 
     <th>Contact</th> 
 
     <th>Country</th> 
 
    </tr> 
 
    <tr> 
 
     <td>Alfreds Futterkiste</td> 
 
     <td>Maria Anders</td> 
 
     <td>Germany</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Centro comercial Moctezuma</td> 
 
     <td>Francisco Chang</td> 
 
     <td>Mexico</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Ernst Handel</td> 
 
     <td>Roland Mendel</td> 
 
     <td>Austria</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Island Trading</td> 
 
     <td>Helen Bennett</td> 
 
     <td>UK</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Laughing Bacchus Winecellars</td> 
 
     <td>Yoshi Tannamuri</td> 
 
     <td>Canada</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Magazzini Alimentari Riuniti</td> 
 
     <td>Giovanni Rovelli</td> 
 
     <td>Italy</td> 
 
    </tr> 
 
    </table> 
 
</div>

関連する問題