jQuery 元素迭代上下文选择器

Question

我正在用 jQuery 创建一个表单验证，但是我遇到了一些问题；

首先我遍历所有要验证的元素并将它们推送到一个数组中（我已经尝试了以下所有方法）：

1. errorfields.push($("#name"));
2. errorfields.push(document.getElementById("name"));
3. errorfields.push("name");

然后，最后我遍历这些项目并想要添加一条错误消息。

for(var i = 0; i < errorfields.length; i++){
  1. var parent = errorfields[i];
  2. var parent = $(errorfields[i]);
  3. var parent = $("#" + errorfields[i]);
}

而这一切的回报是：

[<input>, context: #document, selector: "#name"]

如果我尝试创建 {input} 的 jQuery 对象，它返回的结果完全相同。

即使我写了这样一行：

console.log($("#name"));

它将返回这个带有上下文和选择器的数组。可能是什么问题？

顺便说一句，我无法在这个对象上执行 jquery 函数。这就是重点，看到我想添加一个 2px 红色边框和一个 $(parent).after("error message");

Answer 1

我认为这应该适合你。

errorfields.push( $("#name")[0] );
//Get the html element rather than the jQuery element (an object).

然后在你的 for 循环中你应该有这样的东西：

var parent = $( errorfields[i] );
//This will get you the jQuery element again.

Here is a quick example using divs to show this.

Answer 2

$("#name") 肯定会返回一个包含所有方法的 jQuery 对象。在您的日志中，我认为您只注意到 owned 属性。如果您查找原型链，您将看到所有 $.fn 方法。如果#name 不存在，则长度将为0。

如果你想将一个 jQuery 对象转换成一个数组，你应该使用.get() 或[].slice

var array = $('.example').get();

或：

var array = [].slice.call( $('.example') );