使用jquery隱藏動態添加的div

下面的jquery代碼將隱藏加載頁面時以-value-wrapper結尾的div。我的問題是，「添加更多值」按鈕將追加另一行（數字遞增）。當它發生時，所有的div都會顯示出來。有沒有辦法保留原始圖像並將它們隱藏在新圖像中？使用jquery隱藏動態添加的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(); 
     }); 
});

來源

2010-07-27 newbie-shame

我們可能需要查看添加更多值的代碼。 – gnarf 2010-07-27 20:51:36

這個問題似乎與顯示div的代碼有關。 – 2010-07-27 21:02:15

首先，除非我遺漏了一些東西，否則可以大大簡化隱藏代碼：

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

雖然這引發了問題。爲什麼不設置常規靜態樣式，以便隱藏這些div的默認條件？作爲一種慣例，將默認樣式與頁面元素的默認邏輯狀態對齊是有意義的。所以：

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

現在所有「新」divs將被隱藏。根據需要將您的代碼更改爲show() div（您尚未顯示足夠的數據以瞭解如何，在何處以及何時執行此操作）。如果您要將行爲附加到初始頁面加載後創建的元素上，則應該查看live()或delegate()。

來源

2010-07-28 00:03:28

試圖隱藏輸入按鈕的點擊的div：

$("#edit-gci-add-more").click(function() { 
      $("div[id$='-value-wrapper']").hide(); 
    });

來源

2010-07-27 23:29:08 input

使用jquery隱藏動態添加的div

回答

相關問題