Question

尝试实现获取DOM中错误标记的位置。基于我需要将属性设置为我的代码的位置。如何获得查找p.error位置的通用方法。

这是尝试过的：

情景1：

<div class="col-xs-6"> 
    <label> email </label> 
    <p class="error">Please enter E-mail</p>
    <input type="email" value=""> 
</div>
<div class="col-xs-6"> 
    <label> password </label> 
    <p class="error">Please enter password</p>
    <input type="password" value=""> 
</div>

情景2：

<div class="col-xs-6"> 
    <label> email </label> 
    <input type="email" value=""> 
    <p class="error">Please enter E-mail</p>
</div>
<div class="col-xs-6"> 
    <label> password </label> 
    <input type="password" value=""> 
    <p class="error">Please enter password</p>
</div>

在方案1中，p.error的位置位于输入的顶部。在方案2中，它位于输入字段的下方。

现在找到位置的通用方法是什么，无论是低于还是高于。

previous = $("p.error").prev();
next = $("p.error").next();

previous.on('focusin', function(ev) { });
previous.on('keydown',function(ev) {
    $(this).prev().attr({
        'role': 'xyz',
    });
});
next.on('focusin', function(ev) {
    $(this).prev().attr({
        'role': 'xyz',
    });  
});

Answer 1

您可以通过执行

检查上一个和下一个的tagName属性

previous[0].tagName.toLowerCase() === 'input'; // error is after
next[0].tagName.toLowerCase() === 'input'; // error is before

另一个解决方案是在next（）方法中使用input标签作为选择器，如下所示：

$('p.error').next('input').length > 0; // error is before
$('p.error').prev('input').length > 0; // error is after

如何识别错误标签的位置

1 个答案: