当元素被单击时，用另一个类找到相对于该元素最近的元素并切换它

When element clicked, find closest element relative to this element with another class and toggle it

本文关键字：元素 最近 相对于 单击 另一个      更新时间：2023-09-26

我在这里错过了一些东西。当单击类one的行时，我想只找到与类two最接近的行，然后切换(显示/隐藏)它。

$(".one").on('click', function() {
   $(this).find('.two').toggle(); 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
    <tr class="one">
        <td> Hello </td>
    </tr>
     <tr>
        <td> world </td>
    </tr>
    <tr class="two">
        <td> Foo </td>
    </tr>
    <tr class="two">
        <td> Bar </td>
    </tr>    
</table>

像这样:

$(".one").on('click', function() {
    $(this).nextAll('.two:first').toggle(); 
});
http://jsfiddle.net/DerekL/5ossufmj/

我想你可能需要.next()。它根据在DOM中的位置查找DOM中的下一个兄弟元素。

https://api.jquery.com/next/

或者可以这样:在特定元素

之后获取具有特定类的下一个元素

编辑

下面是一个可行的解决方案:

$('.one').on('click', function () {
    var this_el = $(this);
    var el = findNextWithClass(this_el, "two");
    if (el != null)
    {
        el.toggle();
    }
    else
    {
        alert("null");
    }
});
function findNextWithClass(element, className) {
    var next = element.next();
    if (next.hasClass(className)) {
        return next
    } else {
        if (next != null) {
            return findNextWithClass(next, className);
        } else {
            return null;
        }
    }
}
相关文章：