jquery - 使用jQuery选择指定属性最小值的元素

Question

我需要使用 jQuery 将焦点设置到具有指定属性最小值的元素。例如，在此标记中:

<input type='text' data-myAttr='5' />
<input type='text' data-myAttr='3' />

我想将焦点设置到第二个输入。它可以在 IEnumerable<T> 上用 C# 表达。页面上的元素如下所示:

List<DomElement> elements; //Assume this is full of page elements
DomElement minElement = elements.OrderBy(e => e.attr("data-myAttr")).First();
minElement.Focus();

上下文是我有一个 Web 应用程序 (ASP.NET)，涉及几个不同的 jQueryUI 模式对话框，用于编辑不同类型的记录。他们每个人都有一个定义的选项卡顺序。根据编辑权限，某些模式上的某些字段会替换为文本(标签而不是 DropDownLists 或 TextBoxes)。 jQueryUI 默认聚焦对话框中第一个可聚焦元素的正常行为并不总是适合我，因此我需要将焦点设置到模式中具有最小选项卡索引的元素。

Answer 1

迭代集合，找到最低值并将焦点设置到它，如下所示:

function setDialogFocus() {
    var minValue;
    var minItem;
    $("input[type='text']").each(function() {
        var val = parseInt($(this).attr("data-myAttr"), 10);
        if (val && (!minItem || val < minValue)) {
            minItem = this;
            minValue = val;
        }
    });

    if (minItem) {
        $(minItem).focus();
    }
}

这也可以通过 .map() 来完成，如下所示:

function setDialogFocus() {
    // get an array of all data attributes and their corresponding objects
    var map = $("input[type='text']").map(function() {
        var val = parseInt($(this).attr("data-myAttr"), 10);
        if (val) {
            return ({obj: this, value: val});
        }
    }).get();
    // sort by value to find the lowest value
    map.sort(function(a, b) {return a.value - b.value;});
    if (map.length > 0) {
        $(map[0].obj).focus();
    }
}