Question

出于某种原因，我在以下代码中获得了一个javascript：

var teamOne = "";
var teamTwo = "";
var children = $(this).find(".team-url");
if (children.length === 2) {
    teamOne = children[0].val();
    teamTwo = children[1].val();
}
alert(teamOne + " - " + teamTwo);

错误在.val()上。代码找到2个元素，然后它不能获取该值。如果我删除.val()，我会说它是[Object HTMLInputElement]

错误是

未捕获的TypeError：children [0] .val不是函数

注意：

我知道我可以通过执行以下操作来使用此代码：

var teamOne = "";
var teamTwo = "";
var children = $(this).find(".team-url");
if (children.length === 2) {
    teamOne = children.first().val();
    teamTwo = children.last().val();
}
alert(teamOne + " - " + teamTwo);

但是，我试图理解为什么我的第一个版本不起作用，以便我能更好地理解这些功能。

编辑：

HTML

<div class="col-md-12 game" style="margin-top: 10px">
    <div class="team-details">Team Saturn
        <input type="hidden" class="team-url" value="TeamSaturn">
    </div>
    <div class="team-details">Team Datarnan
        <input type="hidden" class="team-url" value="TeamDatarnan">
    </div>
</div>

Answer 1

试试这个：

HTML

<input type="hidden" value="value 1" class="team-url" />
<input type="hidden" value="value 2" class="team-url" />

JS

var teamOne = "";
var teamTwo = "";
var children = $('body').find(".team-url");
if (children.length === 2) {
debugger;
    teamOne = children[0].value;
    teamTwo = children[1].value;
}
alert(teamOne + " - " + teamTwo);

在您的代码中，“$（this）”不在真实的上下文中，我已在“body”中使用全局搜索更改了它。

The JSFiddle

Answer 2

val对象上没有函数HTMLInputElement。由于children[0]不是jQuery元素，因此不能在其上使用jQuery函数val。但是您可以使用本机javascript：

您可以使用teamOne = children[0].value;

Answer 3

首先，children [0]返回DOM元素而不是jQuery对象，因此您需要使用children[0].value。要获取jQuery对象，您应该使用.eq(0)，.first()，.last()等。

其次是$(this).find()没有上下文。您可以使用$('body').find(".team-url")或$(".team-url")

无法从隐藏元素中获取值

3 个答案: