隱藏jQuery中的無序列表項標籤點擊

Question

我有一個無序列表，呈現如圖所示;

<div id="day4"> 
    <span id="lblDay4" class="calendartilelabel">10/11/2013</span> 
    <hr class="calendartileline" /> 
    <ul id="day4List" class="calendartile"> 
    <li>Nov Sugar Options Expiration</li> 
    <li>Nov Coffee Options Expiration</li> 
    <li class='next'><a href='#'>Next--></a></li> 
    </ul> 
</div> 

我想隱藏當前顯示的ul，但不能檢索ul的id來這樣做。 我用的功能

$("ul.calendartile > li > a").on("click", function (event) { 
     var clickedUl = event.target.id;      
     $(clickedUl).hide();     
    }); 

的問題存在，它隱藏所有無序列表與類calendartile，因此我需要檢索的UL標籤，其標籤被點擊的ID。我試圖使用以下我認爲有道理

$("ul.calendartile > li > a").on("click", function (event) { 
     var clickedUl = event.parent().parent().target.id; 
     alert(clickedUl);     
     $(clickedUl).hide();     
    }); 

但警報是空白的，即沒有找到id。如何找到ul標籤的id，在該標籤下，它的listitem標籤點擊被觸發？

Answer 1

試試這個方法：

$("ul.calendartile > li > a").on("click", function (event) { 
     event.preventDefault(); 
     var clickedUl = $(this).closest('ul').prop('id'); 
     $('#' + clickedUl).hide();     
}); 

event沒有父（）。事件不是一個元素parent（）是jQuery對象上的函數，您始終可以使用this上下文來獲取單擊的元素並使用closest()導航到其父級。

Fiddle

如果你得到一個警報在所有我會很surpised。因爲您必須在控制檯中看到錯誤。