0

好的 .closest() 函数没有正确或根本没有抓取元素,因此没有将类添加到 div 中。这里有什么问题?

HTML:

<div class="half control-group">
        <div class="form-status"></div>
        <?php
        echo form_label('Username', 'username');
        echo form_input(array('name' => 'username', 'maxlength' => 25, 'value' => set_value('username') ));
        ?>
    </div>

查询:

success: function(label) {
    $(label).text('');
    $(label).closest('div[class="form-status"]').addClass('success');
    //label.text('OK!').addClass('valid').closest('.control-group').addClass('success');
}

它使文本正确地变为空白,但它并没有改变最接近的表单状态 div 类......我什至尝试了最接近的('.form-status'),但它仍然不会抓住它。我正在使用验证 jQuery 插件。当您开始输入时,它会在输入栏下方添加此 HTML:

<label for=​"name" generated=​"true" class=​"error valid" style>​​&lt;/label>​

对于任何寻找正确答案的人来说,这行得通:

label.closest('.control-group').find('div.form-status').addClass('success');
4

3 回答 3

3

最接近的只上升 dom 树,它不选择兄弟姐妹。

你需要

$(label).prev('div.form-status').addClass('success');

或者

$('.half.control-group label').prev('div.form-status').addClass('success');

取决于您获得的标签变量是否是 jQuery 选择器。

请注意,正如我之前评论过的,jQuery 和 CSS 中的类都有一个直接选择器,所以你应该更'div.form-status'喜欢'div[class="form-status"]'.

于 2012-12-05T17:56:41.997 回答
0

问题已经解释了一半,你应该使用$.prev()因为$.closest()不看兄弟姐妹。

然而,问题的第二部分就在这里

// What type is label? Is it a string indicating what's in the 
// for="name"? Is it a jQuery object? a DOM object
success: function(label) {
    $(label).text('');
    $(label).closest('div[class="form-status"]').addClass('success');
    //label.text('OK!').addClass('valid').closest('.control-group').addClass('success');
}

如果它被传递一个 jQuery 或 HTMLElement 对象,以下将工作http://jsfiddle.net/Rdpu7/1/

success: function(label) {
    $(label).prev('div.form-status').addClass('success');
    $(label).text('OK!').addClass('valid').closest('.control-group').addClass('success');        
}

如果它正在被传递name,则form_label可以使用以下http://jsfiddle.net/Rdpu7/3/

success: function(label) {
    var label = $("label[for='"+label+"']");
    label.prev('div.form-status').addClass('success');
    label.text('OK!').addClass('valid').closest('.control-group').addClass('success');  
}

如果是别的,你应该改进你的文档,我特别不能忍受没有记录参数的函数,我相信这是你困惑的原因。

关于为什么以下行有效

$('label').prev('div.form-status').addClass('success')

这将完成您页面上的所有标签,这可能不是您想要的。它仅适用于带有单个标签的示例。您的主要问题是您不知道label成功函数中的对象类型

于 2012-12-05T19:26:45.677 回答
0

我已经测试过这个并且工作得很好:

$('label').text(''); 
$('label').prev('div[class="form-status"]').addClass('success');
// ---------^---------use this if you want to add class to just previous div at 
//--------------------same level

如果您想将类添加到同一级别的所有 div,请使用此选项

$('label').siblings('div[class="form-status"]').addClass('success');
于 2012-12-05T18:16:54.733 回答