2

私はこのコードを持っています:

http://jsfiddle.net/VAkLn/6/

テーブルを追加すると: http://jsfiddle.net/VAkLn/7/ これは機能しなくなります。なんで？

解決済み:

これを変更します: price = self.next(".price"), To: price = $(".price"),

4

3 に答える 3

2

最初の例が機能する理由はtr、td要素が要素でのみ有効であるためですtable。ブラウザーは、DOM 内の無効なタグを効果的に取り除き、次のような構造を残します。

<body>
    <input type="input" size="3" class="qta">
    <input type="input" size="7" class="price">
    TOTALE: <input type="input" id="total" size="7" ;="">
</body>

Firebug または Webkit Inspector で確認してください。

next()セレクターinput.priceは、一致した要素のセット内の各要素の直後の兄弟であるため、ここで機能します。

ラッピングtable要素を含めるとすぐに、trandtd要素が構造内で有効になり、期待どおりに DOM に配置されます。

<body>
    <table width="520" border="0" align="center" cellpadding="3" cellspacing="0">
        <tbody>
            <tr>
                <td width="40" bgcolor="#009966" class="whyte">
                    <input type="input" size="3" class="qta">
                </td>
                <td width="100" bgcolor="#009966" class="whyte">
                    <input type="input" size="7" class="price">
                </td>
            </tr>
        </tbody>
    </table>
    TOTALE: <input type="input" id="total" size="7" ;="">
</body>

これは、一致した要素のセット内の各要素の直後の兄弟ではないnext()ため、セレクターを壊します。input.price

input.price解決策は、新しい構造をナビゲートするために jQuery セレクターを変更することです。

price = self.parents('tr').find(".price"),

あなたのフィドルを更新しました。

于 2012-03-31T13:15:33.933 に答える
1

.next() セレクターは、現在の要素の兄弟に対してのみ機能します。最初の例でなぜそれが機能していたのかわかりません...

私はあなたのフィドル ( http://jsfiddle.net/vansimke/n3W4F/ ) をフォークし、いくつかのナビゲーションを追加して、親タグに移動し、次のタグに移動して、内部の「.price」要素を見つけました。それがあなたが望むことをするかどうか見てください。

于 2012-03-31T12:59:33.217 に答える
0

次の関数は、すぐ上の兄弟のみを調べます。各入力は td タグで囲まれているため、直接の兄弟はありません。

self.next(".price")

セレクターは何も返しません。次のようなものを使用できます

self.parents('tr').find(".price").

最初のスニペットが機能する理由はよくわかりません。self 変数の親 (self.parents().foreach(...)) を調べると、親は HTML -> BODY -> INPUT です。TR / TD が TABLE 要素で囲まれていないため、代わりに入力タグが BODY の子になっていると思いますか? 他の誰かがその動作についてより良い説明をしているかもしれません。

于 2012-03-31T13:44:57.380 に答える