javascript - jQueryを使用して各行の各セル値を取得するにはどうすればよいですか

Question

WebPage に動的に行を追加していますが、ある時点で行内の各セルの値を取得したいと考えています。

これは私の行の宣言です:

<tr class="template-upload fade">
<td class="name"><span>{%=file.name%}</span></td>
<td class="title"><label>Andar: <input name="andar" required></label></td>
</tr>

ご覧のとおり、行には名前とタイトルの 2 つのセルがあります。jQueryを使って「name」セルの値と入力「andar」の値を取得しようとしています。

これは私がこれまでに持っているものです:

$('.template-upload tr').each(function () {
        var item = $(this); //this should represent one row

        var name = item.find('.name').text();
        var andar = item.find('input:text[name=andar]').val();
});

ただし、この2つの変数では何も得られません。

ここで何が欠けているのでしょうか?

Answer 1

あなたは近かったのでtr、セレクターから を削除する必要がありました。あなたの行にはすでにクラスがある.template-uploadため、$('.template-upload tr')存在しません:

$('.template-upload').each(function () {
        var item = $(this); //this should represent one row
        var name = item.find('.name').text();
        var andar = item.find('input:text[name=andar]').val();
});

jsFiddle の例

Answer 2

trセレクターから削除します。

$('.template-upload')

Answer 3

あなたのセレクターは正しいですか？それを見ると、セレクターは、クラスを持つ要素内.template-upload trの要素を探していることを意味します。tr.template-upload

私はあなたが望んでいると思います：

$('tr.template-upload').each(...)

Answer 4

.template-upload あなたのtr

セレクターを次のように変更します。

$('.template-upload').each(function(node){ /* logic */ }

Answer 5

タイプミスがあります...

$('tr.template-upload').each(function () {
    ...
});