有没有更奇特的方法来获得同等级的先前物品?

2023-12-11

我有这样的表行:

<tr class="parent0 row3" data-parent="0">
   <td>...</td>
</tr>
<tr class="parent3 row7" data-parent="3">
   <td>...</td>
</tr>
<tr class="parent3 row12" data-parent="3">
   <td>...</td>
</tr>
<tr class="parent0 row8" data-parent="0">
   <td>...</td>
</tr>
<tr class="parent0 row9" data-parent="0">
   <td>...</td>
</tr>

所以如果我有一个点击处理程序:

$(document).on({
   "click": function(){
      var parentId = $(this).data("parent");
      //get previous sibling:
      //OPTION A:
      var prevParentA = 
              $(this).prev("parent" + parentId); //works sometimes
      //OPTION B:
      var prevParentB = 
              $(this).prevAll("parent" + parentId).eq(0); //works all the time but ugly...
   }

}, "tr");

Option A仅当前一个项目具有相同的父项时才有效,但是当它是not案子,prevParentA === []这是not想要的结果。
Option B似乎总是有效,但事实是ugly因为它正在选择ALL匹配该类的先前项目并选择它找到的第一个。

还有比这更好的选择吗Option B?


jQuery 没有比你的选项 B 更好的东西了。我长期以来一直认为这是一个缺失的功能,因为我也经常想要类似的东西。幸运的是,创建自己的方法并不难:

jQuery.fn.prevFind = function(selector) {
    var elems = [];
    this.each(function(i, item) {
        while (item = item.previousSibling) {
            if (item.nodeType == 1) {
                if ($(item).is(selector)) {
                    elems.push(item);
                    break;
                }
            }
        }
    });
    return(this.pushStack(elems, "prevFind", selector));
}

同样可以对nextFind() also.

在您的示例中,而不是这样:

$(this).prevAll("parent" + parentId).eq(0);

你会用这个:

$(this).prevFind("parent" + parentId)

而且,这是两者的实现prevFind() and nextFind()使用一些通用代码:

(function($) {

    $.each({
        'prevFind' : 'previousSibling',
        'nextFind' : 'nextSibling'
    }, function(method, dir) {

        $.fn[method] = function (selector) {

            var elems = [];

            this.each(function(i, item) {
                while (item = item[dir]) {
                    if (item.nodeType == 1) {
                        if ( $.find.matches(selector, [item]).length ) {
                            elems.push(item);
                            break;
                        }
                    }
                }
            });

            return this.pushStack(elems, method, selector);
        };
    });

}(jQuery));

这是小提琴:http://jsfiddle.net/nDYDL/1/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

有没有更奇特的方法来获得同等级的先前物品? 的相关文章