jQuery验证器和datepicker点击不验证

Question

我正在使用jquery验证器来验证文本输入.我遇到的问题是,如果我单击提交它会正确显示所有错误消息.但是,在datepicker输入上,要清除错误消息,我必须选择两次datepicker.即; 1单击以选择并正确输入数据.第二次单击以清除错误消息.

我在某处读过有关在datepicker上使用'on'事件的内容,所以我试过了,但没有区别.我不认为这是正确的编码.我假设无效和成功类是验证器脚本的一部分.值得一试.

这可能会发生什么.谢谢

Sciprt代码

<script type="text/javascript">
$(function() {
        $("#datepicker").datepicker({
            changeMonth: true,
            changeYear: true,
            yearRange: '2011:2037',
            dateFormat: 'dd/mm/yy',
            minDate: 0,
            defaultDate: null
        }).on('changeDate', function(ev) {
    if($('#datepicker').valid()){
       $('#datepicker').removeClass('invalid').addClass('success');   
    }
 });

    });
</script>

HTML代码

<label for"datepicker">
   <input id="datepicker" name="datepicker" type="text" />
</label>

验证器相关代码

规则/消息部分

 datepicker:
    {
        required: true,
        date: true
    },

 datepicker:
    {
        required: " * required: You must enter a destruction date",
        date: "Can contain digits only"
    }

Answer 1

引用OP:

"我必须选择两次日期选择器.即; 1点击选择并正确输入数据.第二次点击清除错误信息."

那是因为验证通常是在事件keyup和blur事件上触发的.由于您使用日期选择器与字段而不是键盘进行交互,因此您干扰了正常的触发事件.

你的代码应该补偿,但过度杀戮......

$(function() {
        $("#datepicker").datepicker({ ... })
.on('changeDate', function(ev) {
    if($('#datepicker').valid()){
       $('#datepicker').removeClass('invalid').addClass('success');   
    }
 });
    });

.valid()只要值发生变化,您只需要在字段上调用方法.

$(function() {
    $("#datepicker").datepicker({ ... })
        .on('changeDate', function(ev) {
            $(this).valid();  // triggers the validation test
            // '$(this)' refers to '$("#datepicker")'
        });
});

但是,这与以前基本相同.

什么是changeDate应该是什么？这是由你的datepicker插件定义的吗？那不是标准的jQuery事件,很可能是整个问题.尝试标准change事件而不是....

$(function() {
    $("#datepicker").datepicker({
        changeMonth: true,
        changeYear: true,
        yearRange: '2011:2037',
        dateFormat: 'dd/mm/yy',
        minDate: 0,
        defaultDate: null
    }).on('change', function() {
        $(this).valid();  // triggers the validation test
        // '$(this)' refers to '$("#datepicker")'
    });
});

Answer 2

Sparky 的回答对我很有用，我唯一要改变的就是不使用 id，我只是在 on 函数中使用了 jquery this，即：

    .on('change', function() {
        $(this).valid();  
    });

这只是让它更一般..-D