Question

我有像

这样的html结构

 <div class="combo-wrapper" tabindex="0" style="display: inline-block; width: 120px; height: 23px;">
<div class="combo-button" style="width: 20px; height: 23px; display: inline-block;"></div>
<div class="combo-selected" style="width: 100px; height: 23px; display: inline-block;">Pending For Upload L2-GM</div>
</div>

在兄弟姐妹中我有一个下拉列表

<select class="bydd">
<option value="">Select</option>
<option value="H">Hold</option>
<option value="D">Delete</option>
</select>

当我试图设置标题时

$(".combo-wrapper").each(function (i) {

        $('.combo-wrapper')[i].attr("title", $('.combo-wrapper')[i].siblings(".bydd option:selected").text());

    });

它抛出未定义的错误

$('.combo-wrapper')[0].siblings()本身在控制台

中不会抛出函数错误

Answer 1

当您通过索引从jQuery对象检索值时，您实际上是在获取基础DOME元素而不是jQuery对象，因此在尝试获取undefined function时出现attr错误。

要通过索引获取jQuery对象，您需要使用eq()方法：

$('.combo-wrapper').eq(i).attr("title", $('.combo-wrapper').eq(i).siblings(".bydd option:selected").text());

或者您可以使用:eq选择器：

$('.combo-wrapper:eq(' + i + ')').attr("title", $('.combo-wrapper:eq(' + i + ')').siblings(".bydd option:selected").text());

Answer 2

因为$('.combo-wrapper')[0]返回一个没有jQuery相关方法的dom元素引用。

您可以使用this（它再次是dom元素引用而不是jQuery包装器）来引用每个循环中的当前元素，然后将其包装在jQuery中以使用jQuery方法

$(".combo-wrapper").each(function (i) {

    $(this).attr("title", $(this).siblings(".bydd").find("option:selected").text());

});

另一种方式是

$(".combo-wrapper").attr("title", function () {
    return $(this).siblings(".bydd").find("option:selected").text()
});

迭代类元素数组并在jquery中选择兄弟

2 个答案: