JQuery: Lấy id yếu tố phụ huynh của một yếu tố nhấp

Question

Tôi có một div như thế này:

<div id="popupDiv1" class="popupDivClass"> 
    <a id="popupDivClose" class="popupCloseClass">x</a> 
</div> 

Khi tôi bấm vào 'x' (Tôi muốn chạy một hàm jquery gọi disablePopup(id); nơi id là id của popupDiv coresponding (tôi có nhiều popupDiv mỗi nút X riêng của nó.

để làm như vậy tôi thực hiện những điều sau

$(".popupCloseClass").click(function (event) { 
    var buttonID = $(event.target).attr("id"); 
    var id = $(buttonID).closest("div").attr("id"); 
disablePopup(id); 
}); 

về cơ bản tôi nhận được id của popupCloseCl ass nhấp sau đó tôi nhận được id của nó là cha mẹ (popupDiv tương ứng) thông qua phương pháp gần nhất. sau đó tôi gọi disablePopup.

Nhưng điều này không hoạt động.

Tôi thậm chí đã thử sử dụng phương thức var buttonID = $(buttonID).parent().attr("id"); nhưng cũng không hoạt động.

Tôi cũng đã cố gắng var id = this.id;

Any help is appreciated rất

Cảm ơn

Answer 1

thay vì sử dụng closest bạn có thể sử dụng parent như thế này ...

var id = $(this).parent().attr("id"); 

Chú ý bạn có thể sử dụng từ khóa this để tham khảo các yếu tố đó khởi sự kiện này. Khi bạn có nó, bạn đang sử dụng giá trị buttonID làm bộ chọn phần tử có giá trị "popupDivClose" và không thêm # khi bắt đầu nó sẽ không tìm kiếm ID, mà là phần tử thẻ có tên "popupDivClose".

Nếu bạn muốn tiếp tục sử dụng buttonID bạn có thể đã sử dụng dòng mã này để làm cho nó làm việc ...

var id = $("#" + buttonID).parent().attr("id"); 

Tuy nhiên, tôi có vẻ rất muốn viết toàn bộ sự kiện như vậy ...

$(".popupCloseClass").click(function (event) { 
    event.preventDefault(); 

    var id = $(this).parent().attr("id"); 

    disablePopup(id); 
}); 

thông báo việc sử dụng event.preventDefault(); điều này sẽ đảm bảo trình duyệt sẽ không xử lý hành động tự nhiên cho liên kết (tức làTrang điều hướng) - Mặc dù vậy, trong Chrome ít nhất, bạn cần phải xác định một giá trị href cho điều hướng nào

Here is a working example

Answer 2

Bạn nên làm

$(".popupCloseClass").click(function (event) { 
    var id = $(this).closest("div").attr("id"); 
}); 

(bạn cũng có thể sử dụng $(this).parent().attr("id");) nhưng sử dụng gần nhất là an toàn hơn trong trường hợp bạn thay đổi cấu trúc html của mình

Answer 3

này hoạt động tốt:

$('a.popupCloseClass').click(function() { 
    var id = $(this).parent().attr('id'); 
});​ 

JSFiddle Demo

Bạn chỉ nên sử dụng this thay vì cách bạn nhận được ID và sau đó cố gắng sử dụng nó làm công cụ chọn (bạn đã bỏ lỡ # bef quặng ID):

Answer 4

này phải làm việc:

$(".popupCloseClass").click(function (event) 
{ 
    var buttonID = $(this).parent().attr('id'); 
    disablePopup(buttonID); 
});