jQuery next() 不返回具有类的下一个兄弟[重复]答案

【问题标题】：jQuery next() does not return next sibling with class [duplicate]jQuery next() 不返回具有类的下一个兄弟[重复]
【发布时间】：2017-04-12 03:13:01
【问题描述】：

这是我的 HTML

</label>
    <input type="checkbox" id="ServiceLocationActive" name="ServiceLocationActive" checked="" value="false">
    <span class="toggle"></span>
    <span class="toggle-text">Active</span>
<label>

这是我的 JavaScript

$('#ServiceLocationActive').on('change', function(){
    if ($(this).is(':checked'))
        $(this).next('.toggle-text').html('Active');
    else
        $(this).next('.toggle-text').html('Inactive');
});

问题是下一个不返回任何东西。如果我尝试仅使用.next()，我将获得第一个跨度，但如果我使用.next('.toggle-text')，我将一无所获。更荒谬的是，如果我使用next().next()，我会得到我想要的元素。

这里发生了什么？

【问题讨论】：

这正是next 的工作方式：Get the immediately following sibling，请改用nextAll() 或siblings()
阅读next() api docs可以自己回答这个问题
如果一个 jQuery 方法没有按照您的预期执行，那么请查看该方法的文档（与常规 JavaScript 方法和函数类似），大多数情况下它正在执行它应该执行的操作，只是不是你所期望的。
@charlietfl 我确实阅读了文档。我想第三个例子让我很困惑。

标签： javascript jquery html

【解决方案1】：

.next() 返回紧跟在兄弟元素之后的元素，.toggle 元素不是 .toggle-text 元素。

你可以使用.siblings()

 $(this).siblings('.toggle-text')

【讨论】：