JQuery在點擊後切換下一個div

Question

我無法找到下一個div以使用JQuery顯示/隱藏它。

的JavaScript：

$("a.more").live("click", function(event){ 
     event.preventDefault(); 
     $(this).next('.show-more').toggle(); 
    }); 

DOM：

  <p> 
       {{beschreibung}} 
       (<a class="more" href="{{id}}"><i class="icon-plus"></i>) 
      </p> 

      <div class="show-more" style="display:none;"> 
       <p> 
        {{beschreibung_lang}} 
       </p> 
      </div> 

任何想法，問題出在哪裏？屏幕和鍵盤之間

失敗：錯過了關閉TAG（ - ;

Answer 1

是在事件處理程序綁定的元素是錨點和錨點沒有兄弟元素，即next（）不起作用。首先，您需要向上遍歷DOM到最近的段落，然後尋找下一個DIV等

live()已被棄用，應與on()動態元素的授權版本取代，就像這樣：

$(document).on("click", ".more", function(event){ 
    event.preventDefault(); 
    $(this).closest('p').next('.show-more').toggle(); 
}); 

Answer 2

click事件被觸發a，當您使用next它會搜索a sibbling類的show-more要修復它其中。 next使用前parent，所以你會搜索show-morep之後的。

$(this).parent().next('.show-more').toggle();

Answer 3

嘗試以下

$("a.more").bind("click", function(event){ 
    event.preventDefault(); 
    $(this).parent().next('.show-more').toggle(); 
}); 

Answer 4

的錨標籤和DIV不是兄弟姐妹，所以你必須起來使用父（） -

$("a.more").live("click", function(event){ 
     event.preventDefault(); 
     $(this).parent().next('.show-more').toggle(); 
    });