父元素選擇問題？

Question

我的HTML是這樣

<div id="mydiv" class="common"> 
     <input type="text" id="text1" value="" /> 
     <input type="text" id="text2" value="" /> 
</div> 

我的文本框的這樣

$(document).ready(function() { 
     $(".common input").click(function() { 

      //////// What I am trying to do is access the id of its parent 
       // in this case it is "mydiv" 
      alert($(this:parent).attr('id')); 
}); 

的onclick事件分配的功能，但它不工作

Answer 1

嘗試$(this).parent().attr('id');

Answer 2

更改爲以下

$(document).ready(function() { 
     $(".common input").click(function() { 

     var divId = $(this).parent().attr('id')); 
     alert(divId); 
}); 

Answer 3

$(document).ready(function() { 
    $(".common input").click(function() { 
     alert($(this).parent().attr('id')); // <- Use $(this).parent() 
    }); // <- don't forget to close this function too 
}); 

Answer 4

你最好使用事件委託，並且只對父項<div>有一個事件處理函數。通過減少所需的事件處理程序的數量，並通過用更簡單，更快速的ID選擇器替換後代和元素選擇器，這將更有效率。此外，在事件處理函數中，您可以自動引用您感興趣的兩個元素（通過evt.target和this），而無需執行任何遍歷。

$(document).ready(function() { 
    $("#mydiv").click(function(evt) { 
     if (evt.target.tagName.toLowerCase() == "input") { 
      alert("Clicked input with ID " + evt.target.id); 
      alert("Parent ID: " + this.id); 
     } 
    }); 
});