Question

我的网页上有一个<select>元素，其中onchange符合设置：

<select id="MySelect" onchange="return myOnChange(this);">Whatever</select>

事件处理程序如下：

function myOnChange(select) {
   var parentNode = select.parentNode;
   //whatever
}

一旦页面加载，用户就会更改下拉列表中的选择并调用事件处理程序，parentNode绑定到某个东西（无论它是什么，它都不是未定义的，这就足够了。）

但是，如果我添加document.ready()：

$(document).ready(function () {
  var select = $('#MySelect');
  var parentNode = select.parentNode;
  //whatever
});

或window.load()：

$(window).load(function () {
  var select = $('#MySelect');
  var parentNode = select.parentNode;
  //whatever
});

然后一旦调用其中任何一个，则parentNode未定义。

这是为什么？如果页面加载后我如何调用我的处理程序，以致parentNode未定义？

Answer 1

因为jQuery对象中没有parentNode。

var parentNode = select.parent()

或

var parentNode = select[0].parentNode;

Answer 2

您正在通过jquery对象访问节点对象的属性

var select = $('#MySelect');
var parentNode = select.parent();

您必须使用jquery的.parent()功能。

在onchange事件处理程序中，您将收到this作为其参数。基本上，this超过它们将代表调用事件的元素。这将是node对象。因此，您可以访问该属性parentNode。但不是在jquery对象上。