Question

我的HTML就是这样的

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

我正在为文本框的onclick事件分配一个函数，就像这个

$(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'));
});

但它不起作用

Answer 1

尝试$(this).parent().attr('id');

Answer 2

您最好使用事件委派，并且只在父<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);
         }
     });
});

Answer 3

将其更改为以下

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

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

Answer 4

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

父元素选择问题？

4 个答案: