如何在javascript中選擇父div的父項？

我有一個使用Javascript的自定義手風琴設置。目前正在使用onclick，我將一個樣式切換到父div（當前擁有一個「卡」類並添加「card-open」）。我的問題是如何更高一格，並開始操縱類「時間蒸汽事件」的div？如何在javascript中選擇父div的父項？

活生生的例子：http://bit.ly/1rr6zGA

HTML：

<div class="time-stream-event" id="{entry_id}"> 
    <div style="background: url({timeline_item_img}) no-repeat center center;" class="event-bg grayscale"></div> 
    <div class="card"> 
     <h3><a href="{title_permalink="/timeline"}">{title}</a></h3> 
     <div class="event-year">{timeline_item_date format="%F %Y"}</div> 
     <a href="#" class="togglelink"></a> 
     <div class="toggle-box"> 
      <p>{timeline_item_description}</p> 
      <div class="employees">Number of Employees</div> 
      <div class="employee-count-no"> <i class="ss-icon">&#x1F465;</i> {timeline_item_employees}</div> 
     </div> 
     <div class="open-arrow"></div> 
    </div> 
</div>

的Javascript：

$.fn.slideFadeToggle = function(speed, easing, callback) { 
    return this.animate({opacity: 'toggle', height: 'toggle'}, speed, easing, callback); 
}; 

$('.toggle-box').hide(); 

$('a.togglelink').on('click', function (e) { 
    e.preventDefault(); 
    var elem = $(this).next('.toggle-box') 
    $('.toggle-box').not(elem).hide(); 
    elem.slideFadeToggle(); 

    var parent_div = $(this).parent().toggleClass('card-open'); 

});

來源

2014-04-25 Dan Lee

嘗試'$（this）.closest（'。time-stream-event'）;' – mdesdev

嘗試.parentElement它會根據您的DOM獲取直接父級。 – ambarox

document.getElementsByClassName（「togglelink」）[0] .parentElement; – ambarox

您可以使用.closest()或.parents()：

var obj= $(this).closest('.time-steam-event');//reference to closest .time-steam-event

或

var obj= $(this).parents('.time-steam-event');//reference to closest .time-steam-event

來源

2014-04-25 10:51:45

因此，我將下列內容添加到onclick中，並且它不會切換類「.time-stream-event-open」。我究竟做錯了什麼？ 'var obj = $（this）.closest（'。time-steam-event'）; obj.toggleClass（'time-steam-event-open'）;'' –

你可以分享問題小提琴嗎？ –

@DanLee：如果你可以用相關的代碼創建小提琴，那將會很棒。 –

，你可以得到這樣的：

var parent_div = $(this).parent().parent();

或：

var parent_div = $(this).parent().closest(".time-steam-event");

來源

2014-04-25 10:53:52

如果你的DIV是在層次結構（按級別）的第2位，你可以使用

var yourdiv = $(this).parent().parent();

或者你可以使用任何.closest()

var yourdiv = $(this).closest('.time-steam-event');

來源

2014-04-25 10:55:26 nrsharma

document.getElementsByClassName("togglelink")[0].parentElement;

這就是它的成效如何使用Javascript。

document.getElementsByClassName("togglelink")

返回具有「togglelink」類的元素數組。您需要獲取精確元素。如果你只有一個元素我的代碼很好。

來源

2014-04-25 11:11:31 ambarox

如何在javascript中選擇父div的父項？

回答

相關問題