3

私はこのようなテーブルを持っています:

Column 1 | Column 2
-------------------
Textbox1 | Text1
Textbox2 | Text2

値を変更したいのですがTextbox1、カーソルが移動すると、イベントが実行されて値がchangeに置き換えられます。Text1Success

<html>
    <head>
        <title>Demo - Change Value</title>
        <script type="text/javascript" language="javascript" src="js/jquery.js"></script>
        <script>
            $(document).ready(function() {
                $('#example table tbody tr td input').change(function() {
                    var rowEdit = $($(this).parents('tr').html());

                    rowEdit.closest('.sub').html('Success');
<!--                    $('.sub').html('Change');-->
                })
            })
        </script>
    </head>

    <body>
        <div id="example">
            <table>
                <thead>
                    <th>Column 1</th>
                    <th>Column 2</th>
                </thead>
                <tbody>
                    <tr>
                        <td><input type="text" /></td>
                        <td class="sub">123</td>
                    </tr>
                    <tr>
                        <td><input type="text" /></td>
                        <td class="sub">456</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </body>
</html>

問題は、呼び出した後も値が変更されなかったということですが、を使用すると値がrowEdit.closest('.sub').html('success');変更されます。Text1Text2$('.sub').html('Change');

input私の目標は、同じ行の列1の値を変更するときに、列2内のテキストを変更することです。どうすればそれを達成できますか?

4

4 に答える 4

4

これを試して:

$(document).ready(function() {
  $('#example table tbody tr td input').change(function() {
    var rowEdit = $(this).parents('tr');
    rowEdit.children('.sub').html('Success');
  })
})

親のtr要素をフェッチしたので、children()でうまくいくはずです。

これがjsFiddleです

于 2012-08-29T04:29:51.090 に答える
1

あなたが何をしようとしているのか正確にはわかりませんが、これをチェックしてください

JsFiddleデモ

于 2012-08-29T04:39:26.647 に答える
1

これを試してみてください....フィドル

$('#example input').change(function() {
   $(this).closest('tr').find('td.sub').html('Success');
});
于 2012-08-29T04:40:54.820 に答える
0

JS Fiddleに変更を追加しました:http://jsfiddle.net/abhisheks/ZPLdu/2

他に変更がありましたらお知らせください。

于 2012-08-29T04:40:11.573 に答える