jQuery的獲得點擊的元素的父jQuery對象

Question

我的HTML包含很多這樣的對象：

<div class="class"> 
    <div class="disconnect_btn">Click here</div> 
    <input type="hidden" name="ID" value="12"/> 
</div> 

我必須結合其他功能按鈕元件的功能。就像這樣：

$('.disconnect_btn').bind('click',function(e){ 
    disconnectFunction(e); 
}); 

我想要做的IST拿到第一的股利，其中鍵是什麼，我試圖用e.parents('.class')方法，但是這就像對象將返回錯誤有沒有方法... 我的第二個目標是從父母Div的隱藏輸入字段中提取值屬性。

function disconnectFunction(e){ 
    var parent = e.parents('.class')); //returns error 
    var ID = parent.find('input:hidden[name=ID]').attr('value'); 
    console.log(ID); 
} 

我也嘗試這樣做，$（本）選擇，但不知何故，我得到了stucked現在，也許有一個簡單的解決方案，我無法找到。

Answer 1

您將事件傳遞爲argum而是通過DOM。

您可以通過如下這樣做從事件傳遞，

$('.disconnect_btn').on('click',function(e){ 
    disconnectFunction(e.target); 
}); 

和disconnectFunction你可以如下使用它。

function disconnectFunction(e){ 
    var parent = $(e).parents('.class')); //returns error 
      ---^^^^^----- 
    var ID = parent.find('input:hidden[name=ID]').attr('value'); 
    console.log(ID); 
} 

Answer 2

您需要傳遞當前對象而不是事件對象。並請使用（'events'）方法將事件附加到dom元素。

可能性

1. 您可以通過當前對象
2. 您可以通過Event.Target屬性訪問在事件對象當前對象。

3. 你可以在你的函數中訪問這個對象。

   $('.disconnect_btn').on('click',function(e){ 
       disconnectFunction(this); 
   }); 
   
   function disconnectFunction(currObj){ 
       var parent = $(currObj).parents('.class')); 
       var ID = parent.find('input:hidden[name=ID]').attr('value'); 
       console.log(ID); 
   } 
   

或alternativily你可以在函數訪問這個對象也

function disconnectFunction(e){ 
     var parent = $(this).parents('.class')); //here this refer to clicked object 
     var parent = $(e.Target).parents('.class')); //Using event.Target Property 
     var ID = parent.find('input:hidden[name=ID]').attr('value'); 
     console.log(ID); 
    } 

Answer 3

你的問題是你要使用event對象，而不是HTML對象。

$('.disconnect_btn').bind('click',function(e){ 
    // `e` refers to event object received by the callback function 
    // `this` refers to the HTMLElement that was clicked 
    // $(this) turns `this` (which is HTMLElement object) to `jQuery` object 
    disconnectFunction($(this)); // this will do the trick 
    // now, you can use `e` parameter inside disconnectFunction 
    // as a `jQuery` object which has `parents` method defined 
}); 

Answer 4

你像使用：

var parent = e.parents('.class')); //returns error 

用作這樣的：

var parent = $(e).parents('.class'); 

Answer 5

使用e.target獲得點擊的元素，e是事件對象。您也可以使用.closest()獲得第一個父級class。

另注：使用.val()獲得一個輸入字段的值，而不是使用.attr()

function disconnectFunction(e){ 
    var parent = $(e.target).closest('.class')); //returns error 
    var ID = parent.find('input:hidden[name=ID]').val(); 
    console.log(ID); 
} 

另一種解決方案是將點擊的元素傳遞給disconnectFunction

function disconnectFunction(el){ 
    var parent = $(el).closest('.class')); //returns error 
    var ID = parent.find('input:hidden[name=ID]').val(); 
    console.log(ID); 
} 

然後

$('.disconnect_btn').bind('click',function(e){ 
    disconnectFunction(this); 
}); 

Answer 6

試試這個

$('.disconnect_btn').bind('click',function(e){ 
    disconnectFunction($(this)); 
}); 

和

function disconnectFunction(e){ 
    var parent = $(this).parents('.class'); 
    var ID = parent.find('input:hidden[name=ID]').attr('value'); 
    console.log(ID); 
} 

Answer 7

你只需要做到這一點：

$('.disconnect_btn').on('click',function(e){ 
    disconnectFunction($(e.target)); // <== Pass $(e.target) or $(this), in place of e 
}); 

而且

function disconnectFunction(e){ 
    var parent = e.parents('.class'); // <== Remove a extra bracket here.. 
    var ID = parent.find('input:hidden[name=ID]').val(); 
    console.log(ID); 
}