向下滑動Next從H3與jQuery的UL

<h3>Details<span class="dropdown">View</span></h3> 
    <div id="sbc"> 
     <ul> 
      <li><h2>Role: Supervisor</h2></li> 
      <li>Manager Contact:</li> 
      <li class="small">*location closed - please contact corporate office for further assistance</li> 
      <li><a href=""></a></li> 
      <li><h2>Responsibilities</li> 
      <li> 
       <ul> 
       <li>Assist customers with miscellaneous issues from AIV, AppStore, Kindle Tier 2</li> 
       <li> - Fallback - Kindle Tier 1</li> 
       </ul> 
      </li> 
     </ul> 
    </div>

試圖將jQuery寫入onClick slide在UL下面的UL下。嘗試了多種解決方案，但都似乎失敗。向下滑動Next從H3與jQuery的UL

這是我的jQuery代碼：

<script> 
(function() { 
    $('span.dropdown').on('click', function() { 
     $(this).next('ul').slideToggle(); 
    }); 
})(jQuery); 
</script>

貨架我的大腦幹....我不是一個完整的小白（但顯然我），他會喜歡一些幫助。

在點擊 ***向下滑動： UL：跨度

切換之後。

來源

2013-05-09 Nicholas Hazel

你需要這樣做：

$(this) 
    .parent()  // Go to the parent h3 element of current span clicked 
    .next('#sbc') // Go to the next div element with id 'sbc' 
    .children('ul') // Go to its child ul element 
    .slideToggle(); // and finally slide toggle

來源

2013-05-09 08:22:27

回答我自己的問題.... （是12秒後）

<script> 
(function() { 
    $('span.dropdown').on('click', function() { 
     $(this).parent().next('ul').slideToggle(); 
    }); 
})(jQuery); 
</script>

感謝您的幫助！我知道我是一個傻瓜，並錯誤地記錄DOM :-P

來源

2013-05-09 08:16:28

我不明白這是如何工作的，父'h3's'下一個元素是'div'，不' ul'？ – billyonecan 2013-05-09 08:19:21

您需要遍歷到父第一，獲得下一個元素，然後讓孩子ul：

$(this).parent().next().children('ul').slideToggle();

由於您div有id和id必須是唯一的，你可以只是做：

$('#sbc > ul').slideToggle();

來源

2013-05-09 08:17:27 billyonecan

在這種情況下，'ul'不是'＃sbc'的直接後代，或者你有多個具有相同'id'的元素（'＃sbc'） – billyonecan 2013-05-09 08:30:22

試試這個讓我知道

$('.dropdown').on('click', function() { 
     $(this).parent().next().children('ul').slideToggle(); 
});

來源

2013-05-09 08:20:27

試試這個

$('span.dropdown').on('click', function() { 
    $('ul').slideToggle(); 
    // alert('hi'); 
});

來源

2013-05-09 08:22:38

向下滑動Next從H3與jQuery的UL

回答

相關問題