javascript - 获取 jQuery 中的顶部元素

Question

我构建了以特定方式显示错误的高级验证插件。

但是，当用户输入无效时，我滚动页面到验证失败的第一个元素。

是这样的looks :

那么问题出在哪里呢？

我用黑色加粗了 TD。

因此您可以看到 Currency textbox 在第一个 TD 上，而 Owner Name textbox 在第二个 TD 上

因此 Currency 文本框 首先 已验证，因此，页面滚动到 Currency 位置而不是 OwnerName 文本框位置。 (如我所愿)

问题:

我怎样才能找到最顶层的元素(假设所有失败的元素都有 .failed 类 - 只是为了简单起见)。

Answer 1

只需遍历每个元素:

var $failed = $('.failed');
var top = null;    // current "smallest" value
var found = null;  // current "topmost" element

$failed.each(function() {
    var $this = $(this);
    var cur = $this.offset().top;
    if (top === null || cur < top) {
        found = this;
        top = cur;
    }
});     

或者，如果您实际上并不关心它是哪个元素，而只是想要滚动位置:

var tops = $failed.map(function() {
    return $(this).offset().top;
}).get();

var top = Math.min.apply(null, tops);

注意:代码更正为使用 .offset 而不是 .scrollTop