jQuery在單擊關閉按鈕時僅會隱藏該特定的div嗎？

Question

我有這個標記。 記住所有這些都來自數據庫。 我已經使用了foreach循環，並且正在獲取這些值

<div id="announcment-wrap">
    <div class="announcement-text">
    This is again a dummy 
    <a href="http://www.google.com">|&nbsp;click here</a>
    <a id="close" href="#" class="close">X</a>
  </div>
    <div class="announcement-text">
    This is demo 3 
    <a href="http://www.google.co.in">|&nbsp;Demo3</a>
    <a id="close" href="#" class="close">X</a>
  </div>
    <div class="announcement-text">
    This is demo 4 
    <a href="http://facebook.com">|&nbsp;Demo again</a>
    <a id="close" href="#" class="close">X</a>
  </div>    
</div>

現在您可以看到有一個關閉按鈕<a id="close" href="#" class="close">X</a> 。 我希望當有人單擊關閉按鈕時，它只會在我使用jquery時將其隱藏在div（）中

jQuery(document).ready(function($) {
  jQuery('#close').click(function() {
    jQuery('.announcement-text').hide();
  });
});

它僅適用於第一個塊，並且也隱藏了所有塊的總數？ 所以有人可以告訴我如何做到這一點，當有人單擊關閉按鈕並隱藏該特定塊時。

Answer 1

ID應該是唯一的，因此請使用選擇器作為.close而不是#lose

試試http://jsfiddle.net/devmgs/ZGjaj/

您的每個文字是

<div class="announcement-text">
    This is again a dummy 
    <a href="http://www.google.com">|&nbsp;click here</a>
    <a id="close" href="#" class="close">X</a>
</div>

采用

$(document).ready(function($) {
  $('.close').click(function() { 
    $(this).closest('.announcement-text').hide();
  });
});

Answer 2

ID應該是唯一的，因此請改用類，然后嘗試使用.closest()

<a href="http://www.google.co.in">|&nbsp;Demo3</a>
<a class="close" href="#" class="close">X</a>
-----^

jQuery(document).ready(function($) {
  jQuery('.close').click(function() {
    jQuery(this).closest('.announcement-text').hide();
  });
});

Answer 3

嘗試：

jQuery(document).ready(function($) {
  jQuery('#close').click(function() {
    jQuery(this).parent('.announcement-text').hide();
  });
});

Answer 4

由於關閉按鈕位於div內，因此您可以使用.parent（）函數選擇div。

jQuery(document).ready(function($) {
   jQuery('#close').click(function() {
      jQuery(this).parent().hide();
   });
});

祝一切順利！！ 希望這可以幫助。

Answer 5

您需要使用類 .close來處理所有關閉按鈕，或者為所有按鈕指定不同的ID 。

   jQuery(document).ready(function($)  {
      jQuery('.close').click(function(){
jQuery(this).closest('.announcement-text').hide();});});  

Answer 6

首先，對於所有“關閉”按鈕，“刪除重復的ID”，您不能具有相同的ID。 這將無法在IE7中工作<

$(document).ready(function($) {
  $('.close').click(function() {
    $(this).parent('.announcement-text').hide();
  });
});