0

colBボタンが同じ行でクリックされたときにテキストボックスの値を取得したい。しかし、私のセレクターはそこに到達していません。また、IE8で動作する必要があります。

フィドル

<table>
    <thead>
        <tr>
            <th>&nbsp;</th>
            <th>colA</th>
            <th>colB</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td> <a class=btn class=foo>foo</a>

            </td>
            <td>
                <input type=text value=1 />
            </td>
            <td>
                <input type=text value=2 />
            </td>
        </tr>
        <tr>
            <td> <a class=btn class=foo>foo</a>

            </td>
            <td>
                <input type=text value=3 />
            </td>
            <td>
                <input type=text value=4 />
            </td>
        </tr>
    </tbody>
</table>


$('.foo').on('click', function (item, evt) {
    var foo = $(evt.target);
    var tr = btn.parent().parent();
    var col3 = tr.children(':eq(2)');
    var txt = col3.find('input');
    alert(txt.val());
});
4

2 に答える 2

0

jQuery コードを使用してこれを行うのではなく、行に関連するボタンに ID を割り当ててみませんか。クリックすると、そのそれぞれの列のテキストボックスの値を取得すると、非常に簡単になります。また、クラスと型を割り当てる方法が正しくありません。それらは引用符で囲む必要があります。複数のクラスも複数のクラス属性を必要としないため、ボタン クラスは class="btn" class="foo" ではなく、class="btn foo" にする必要があります。

例:

<tbody>
    <tr>
        <td> <a id="col1" class="btn foo">foo</a>

        </td>
        <td>
            <input id="col1_input1" type="text" value=1 />
        </td>
        <td>
            <input id="col1_input2" type="text" value=2 />
        </td>
    </tr>

于 2013-06-11T23:17:45.440 に答える
0

私はお勧めします:

$('.foo').on('click', function () {
    var btn = $(this),
        tr = btn.closest('tr'),
        col3 = tr.find('td').eq(2),
        txt = col3.find('input');

    alert(txt.val());
});

JS フィドルのデモ

これには、いくつかの修正された HTML が必要であることに注意してください。

<td>
    <a class='btn foo'>foo</a>    
</td>

複数のclass属性があり(1つしか持てません)、それぞれに単一の(引用符なしの)クラス名があります(これは有効です。引用符オプションですが、値が1つしかない場合のみです)。

また、あなたは使用していました:

var foo = $(evt.target);

on()メソッド内にはイテレータがないようitemに見えます (一度に 1 つの要素にしか作用できないため、これは理にかなっています) evtnull物体。

そして、次のとおりです。

var tr = btn.parent().parent();

変数を定義したbtnことがないため、祖先を見つけるために使用できませんでした。

参考文献:

于 2013-06-11T23:02:58.967 に答える