javascript - 从循环执行时.hide()不是函数错误

我希望能够遍历几个不同的标签并根据是否选中单选按钮来隐藏其内容。这是我想出的解决方案，但控制台中始终出现错误。

var hazardOptions = $(".js-hazardous-option");
var hazard = $("input[name=Hazardous]");
for (var i = 0, len = hazard.length; i < len; i++) {
    if (hazard[i].id === "HazardousYes" && hazard[i].checked) {
        for (var ii = 0, length = hazardOptions.length; ii < length; ii++) {
            hazardOptions[ii].show();
        }
    } else if (hazard[i].id === "HazardousNo" && hazard[i].checked) {
        for (var iii = 0, leng = hazardOptions.length; iii < leng; iii++) {
            hazardOptions[iii].hide();
        }
    }
}

我得到的错误是:



不确定我缺少什么，我尝试过在线查找类似问题，但是没有运气。我很确定问题出在这里:hazardOptions[iii].hide();，但不是很确定为什么和/或如何解决它。

最佳答案

当您从JQuery选择器中获得对象列表时，如果尝试通过索引访问它们，则实际上返回的是DOM元素，而不是JQuery对象。确实令人困惑，但it is in the documentation。

您实际上需要做的是将其重新变成一个JQuery对象:

$(hazardOptions[iii]).hide();

或者，您也可以使用 eq() function来提供JQuery对象广告，从而仍然具有hide()函数:

hazardOptions.eq(iii).hide();