Question

使用jQuery移动日期框时，我遇到了jQuery验证问题。

我的验证设置为：

onkeyup: false

我相信它会触发焦点/模糊（制表符）事件的验证。

问题是，当我使用日期框选择器设置日期时，它似乎不会触发此事件，因此如果我有一个日期为“必需”并且已填写的日期框，则仍会显示错误消息...

编辑：

这是我的小提琴：

http://jsfiddle.net/3v2ZV/

HTML

<form id="my_form" method="post">
    <input name="name" id="full-name" data-theme="a" placeholder="Name" class="required">
    <input name="athlete_datebox" id="athlete_datebox" data-theme="a" placeholder="Date of Birth" class="required">
    <input type="submit" value="submit">
</form>

JS

$(document).ready(function () {
    $('#my_form').validate({
        onkeyup: true
    });
    $('#athlete_datebox').mobiscroll().date({
        theme: 'jqm',
        display: 'modal',
        mode: 'clickpick',
        dateOrder: 'mmD ddyy',
        dateFormat: 'yy-M-dd',
        endYear: 2034
    });
    $('#my_form').on('submit', function (event) {
        event.stopPropagation();
        event.preventDefault();
        if ($('#my_form').valid()) {
            alert('is valid');
        }
    });
})

如果在填写任何内容之前点击“提交”，则会看到这两个字段都是必填字段。但是，在使用mobiscroll日期选择器填写日期后，即使该字段不为空，该字段仍会按要求列出。

Answer 1

“我的验证设置为：

onkeyup: false

我相信它会触发焦点/模糊（制表符）事件的验证。“

您只是关闭了onkeyup事件。 onfocusout事件是完全不同的选项，默认情况下为“on”，除非您将其关闭。

由于您没有提供任何代码，我无法向您提供更详细的解决方案。

但是，您描述的问题很可能通过使用内置于日期选择器中的回调函数来解决（哪一个？）。像“在变化中”或“在选择中”之类的东西，如果有这些可用的话。

然后在回调函数中，您需要调用the jQuery Validate plugin's .element() method，它以编程方式触发仅对该特定元素进行验证测试。

$('#myform').validate().element('#myelement');

如果它没有回调函数，你可以尝试使用元素jQuery change event这样的东西。

$('#myelement').on('change', function() {
    $('#myform').validate().element('#myelement');
});

修改：

关于jsFiddle中的代码。

1）不要在validate内的选项后放置分号。这打破了插件。

2）不要使用submit处理程序来检查表单是否有效。内置的submitHandler回调已经执行了此操作。

3）您的</form>标记拼写为</for>

OP的编辑小说：http://jsfiddle.net/3v2ZV/4/

jquery使用jquery移动日期框验证（mobiscroll）

1 个答案: