Question

下面是我使用jQuery获取输入元素的代码：

var txt = $(tableRow).find('input:text');
if (txt.value == null) {
  //TO DO code
}

这是我用纯JavaScript做的方式

var txt = document.getElementById('txtAge');
if (txt.value == null) {
  //TO DO code
}

第一种方式是txt的值未定义。但是第二种方式是值是输入元素内部的值。现在更有意思的是，在Mozilla Firebug的右下方窗格中，如果我向下滚动到txt的“值”，我可以在那里看到它，两种方式。

我知道我可以简单地说$(txt).val()，但我也想知道为什么我不能访问元素的值，如果它被jQuery选中的话。 jQuery不仅仅是JavaScript函数库吗？

Answer 1

.value不是jquery api的一部分。您应该使用.val()代替：

var txt = $(tableRow).find('input:text');
if (txt.val() == "") {
  //TO DO code
}

dom对象和jquery dom对象并不完全相同。实际上，您可以打开开发人员工具（在webkit中）或Firebug（Firefox）来检查内部的内容。 Jquery拥有更多信息（实际上，它包含它所代表的dom的实例）。因此，如果您想使用.value，则需要从jquery对象调用“generic”dom对象，然后使用.value。

Answer 2

jQuery使用各种本机和非本机技术选择DOM元素，并将它们全部放在它自己的类似数组的实例中，该实例也将它们包装在自己的API中。 jQuery没有“扩展”本机DOM属性或方法，因此您需要将DOM节点作为目标。

这样想：

var node = document.getElementById('txtAge'); // the DOM node
var txt = $('#txtAge'); // the same node wrapped in a jQuery object/API

由于jQuery对象拥有类似于数组的DOM节点集合，因此您可以通过执行以下操作来访问第一个元素：

txt[0] // same as node

但通常建议您使用.get()方法：

txt.get(0)

另一种更好的jQuery方法是使用.each()迭代jQuery集合：

$(tableRow).find('input:text').each(function() {
    // "this" in the each callback is the DOM node
    if ( this.value == null ) {
        // Do something
    }
});

Answer 3

var x = $(tableRow).find('input:text');

这是一个jquery对象。

`x.value`

jquery对象中没有属性值。所以它返回undefined。

x.val()是一种可用于获取元素值的方法。

Answer 4

.find()将返回类似arry的对象。如果您确定只有一个元素与您的查询匹配，那么您可以

var txt = $(tableRow).find('input:text')[0].value;

这不是非常类似jQuery，可以说更像是jQuery和DOM方法的不匹配，但它会得到你想要的。此外，由于您作为DOM示例显示var txt = document.getElementById('txtAge');，因此可以在jQuery中重写为

var txt = $('#txtAge')[0];

使用jQuery获取元素时，值未定义

4 个答案: