Question

我目前正在构建一个html表单并使用jquery进行验证。

每个输入字段的设置如下：

<div class="controls">
    <input type="text" class="input-xlarge" name="name" id="name">
    <div class="info">&nbsp;</div>
    <div class="valid" style="display:none;">&nbsp;</div>
</div>

到目前为止，这是我的jquery：

$('.controls input').blur(function() {                   
    if( !$(this).val() ) {                    
        $(this).css('border-color','red');
        $(this).find('.info').css('display','none');
        $(this).find('.error').css('display','inline-block');

这个想法是当用户查看表单时，info div显示。如果他们继续通过输入显示表单而不会输入任何信息，则错误类将显示并删除信息类。

关于我哪里出错的任何想法？

干杯，丹

Answer 1

试试这个，你需要在这里使用siblings方法：

$('.controls input').blur(function () {
    if (!$(this).val()) {
        $(this).css('border-color', 'red');
        $(this).siblings('.info').css('display', 'none');
        $(this).siblings('.error').css('display', 'inline-block');
    }
});

Answer 2

您的选择器只获取输入字段。

在代码$（this）的回调块中引用输入标记。

试试这个：

     $(this).css('border-color','red');

     $(this).parents('.controls').find('.info').css('display','none');
     $(this).parents('.controls').find('.error').css('display','inline-block');

输入模糊显示/隐藏类的jquery

2 个答案: