Question

<div class="row">
    <label for="txtTitle">Title</label>
    <div class="holder">
        <div class="text-holder"> <span class="ico-error"></span><span class="text"> <input id="txtTitle"
     runat="server" type="text" value="" /></span>  <span class="t-l">
     </span><span class="b-l"></span><span class="t-r"></span><span class="b-r"></span> 
        </div>
    </div>
</div>

我有以下HTML。我打算在输入框上做一些Jquery验证。如果这是无效的，我想将错误类添加到div

        var isValid = true;
        var errorMessage = '';
        if ($('#<%=txtTitle.ClientID %>').val() == '') {
            $('#<%=txtTitle.ClientID %>').parent().parent().parent(".row").addClass("error");
            isValid = false;
            errorMessage += "Firstname is required\n";
        }
        return isValid;

我试图定位父母，但看到这个div进一步向父母heirachy。所以试图用更多的父标签来选择heirachy，但是我认为我偏离了理解正确的目标div的方法。

Answer 1

我建议使用.closest()：

描述：对于集合中的每个元素，获取第一个元素通过测试元素本身并遍历来匹配选择器通过DOM树中的祖先。

var isValid = true;
var errorMessage = '';
var $this = $('#<%=txtTitle.ClientID %>');

if ($this.val() == '') {
    $this.closest(".row").addClass("error");
    isValid = false;
    errorMessage += "Firstname is required\n";
}
return isValid;

Answer 2

如果您需要查找树，请使用.parents()方法并将其传递给包含div的类，即：.parents('.row')

Jquery选择包含目标div

2 个答案: