3

以下の jquery コードは、ページの読み込み時に -value-wrapper で終わる div を非表示にします。私の問題は、「値を追加」ボタンが別の行を追加することです（数値が増加します）。その場合、すべての div が表示されます。元のものを非表示にして、新しいセットでも非表示にする方法はありますか?

HTML マークアップは次のようになります。

<div id="group-information-items">
    <fieldset>
        <legend>Member Information</legend>
        <label>Form label 1</label>
        <table>
            <tr>
                <td>
                <div class="form-radios">
                    <input type="radio" class="form-radio" checked="checked" value="0" name="gci[0][fa][value]" id="edit-gci-value-0"> A
                    <input type="radio" class="form-radio" value="1" name="gci[0][fa][value]" id="edit-gci-value-0">B 
                </div>

                <!-- This is the div that is hidden -->
                <div id="edit-gci-0-fa-list-value-wrapper" class="form-item">
                    <label>List: </label>
                    <textarea name="gci[0][fa_list][value]" rows="5" cols="60"></textarea>
                </div>

                </td>
            </tr>
        </table>

        <!-- WHEN THIS BUTTON IS CLICKED, A CLONE OF THE ROW ABOVE IS APPENDED TO THE TABLE -->
        <!-- THE ONLY DIFFERENCE IS [0] BECOMES [1] AND SO ON -->
        <div class="content-add-more clear-block">
            <input type="submit" value="Add more values" id="edit-gci-add-more" name="gci_add_more">
        </div>
    </fieldset>
</div>

最初の非表示を行うコードは次のとおりです。

$("#group-information-items div").each(function() {
        $("div[id$='-value-wrapper']").each(function() {
                        $(this).hide();
        });
});
4

2 に答える 2

1

まず、何かが欠けていない限り、その隠しコードを大幅に簡素化できます。

$("#group-information-items").find("div[id$='-value-wrapper']").hide();

ただし、これには疑問があります。これらの div のデフォルト条件が非表示になるように、通常の静的スタイルを設定してみませんか? 慣例として、デフォルトのスタイルをページ要素のデフォルトの論理状態に合わせることは理にかなっています。そう：

div#group-information-items div.form-item { display: none; }

これで、すべての「新しい」div が非表示になります。必要に応じてコードをshow()div に変更します (これを行う方法、場所、時期を十分に示していません)。最初のページの読み込み後に作成された要素にビヘイビアを追加する場合は、live()またはを参照してくださいdelegate()。

于 2010-07-28T00:03:28.550 に答える
0

入力ボタンをクリックしてdivを非表示にしてみてください：

  $("#edit-gci-add-more").click(function() {
             $("div[id$='-value-wrapper']").hide();
  });
于 2010-07-27T23:29:08.107 に答える