如何根据元素数组中的DOM位置聚焦无效元素

How to focus invalid element by DOM position from the array of Elements?

本文关键字：元素 位置 DOM 聚焦 无效 何根 数组      更新时间：2023-09-26

我正在进行验证。在验证中，只要from元素无效，我就会推送到一个数组。

当用户单击提交按钮时，我希望关注元素，而不是它的数组位置。而是通过CCD_ 1位置。

问题是因为，发送id的服务器是前端。而它们发送与表单元素顺序不同的id。

你知道吗？简单地说，我想根据推送元素的DOM位置对其进行排序。。。

这是我的重点方法：

this.validate = function () {
        $.each(this.elements, function (i,elem) {
            var element = $(elem);
            var prop = String(element.get(0).type).toUpperCase();
            var result = that.validateOne({"prop":prop,"elem":element});
        });
        if(that.validateResut.length)
            that.validateResut[0].focus(); //it is focusing last element or mid some time.. i would like to focus by DOM position
    }

提前感谢。

实时演示(示例(

您可以尝试使用此代码进行排序。稍后您可以相应地附加它：

obj.sort(positionSort); //Call the function by passing the array of elements.
function positionSort(a, b) {
    var A = $('#' + a).position().top;
    var B = $('#' + b).position().top;
    return ((A < B) ? -1 : ((A > B) ? 1 : 0));
}

演示：http://jsfiddle.net/lotusgodkk/W2528/3/

有关结果，请参阅控制台。

在您发布的代码中，您有元素，并且您知道它是否有效。为什么不在需要的地方跟踪它呢：

var obj = ['country', 'username', 'email', 'password', 'zip'];
var f = $('form');
var elems = f.find('input');
elems.filter('[type="button"]').click(function() {
    var invalid = [];
    elems.each(function () {
        var element = $(this);
        if ($.inArray(element.attr('id'), obj) !== -1) {
            var result = Math.random()<.5; // Random boolean just for test purposes
            if (!result) {
                invalid.push(element);    
            }
        }
    });
    invalid.shift().focus(); // focus on first element in array
    // invalid.pop().focus(); // focus on last element in array
});

在操作中查看

相关文章：