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

我在使用jQuery移动日期框时遇到了jQuery验证问题。jquery使用jQuery移动日期框验证（mobiscroll）

我有我的验证设置为：

onkeyup: false

我相信这会触发焦点/模糊（标签）事件的确认，而不是。

问题是，当我使用datebox选择器设置日期时，它似乎不会触发此事件，因此如果我将datebox的日期设置为“required”并填写完毕，则错误消息仍然存在显示...

编辑：

这里是我的小提琴：

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>

$(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日期选择器填写日期后，该字段仍然按要求列出，即使它不是空的。

来源

2013-03-25 redconservatory

您的代码_por favor_;） – Omar 2013-03-25 15:26:43

您只需关闭'onkeyup'。 'onfocusout'事件是一个不同的选项，默认情况下，除非你关闭它。你将不得不显示所有相关的代码，包括datepicker。 – Sparky 2013-03-25 15:29:24

“我有我的验证设置为：

onkeyup: false

我相信这将触发对焦点/模糊（标签）事件中的确认，而不是”。

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

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

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

然后在回调函数中，您需要调用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/

来源

2013-03-25 15:49:39 Sparky

我修复了其中的一些内容，但是今天并没有在jsfiddle中保存（也就是说我改变了窗体的内容并且更新了内容，但是没有骰子？） – redconservatory 2013-03-25 16:00:05

@redconservatory，它在这里工作：http://jsfiddle.net/3v2ZV/ 4/ – Sparky 2013-03-25 16:01:14

明白了......谢谢！ – redconservatory 2013-03-25 16:17:09

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

回答

相关问题