如何验证 3 个字段中的日期输入?

2024-02-29

我有 3 个用于日期输入的字段:

<input type="text" id="passport-doi-1" name="passport-doi-1" placeholder="DD" maxlength="2">
<input type="text" id="passport-doi-2" name="passport-doi-2" placeholder="MM" maxlength="2">
<input type="text" id="passport-doi-3" name="passport-doi-3" placeholder="YYYY" maxlength="4">

我应该如何使用 jQuery Validate 插件验证如果输入了日期,那么这是正确的?

看来我应该创建groups字段(只有一条错误消息),然后是自定义验证规则。但它应该是什么样子呢?

Upd。我尝试执行以下操作,但它不起作用:

$.validator.addMethod('validDate', function (value, element) {
  var dd = $("#passport-doi-dd").val();
  var mm = $("#passport-doi-mm").val();
  var yyyy = $("#passport-doi-yyyy").val();
  if (dd=="" && mm=="" && yyyy=="") return true;
  try {
    var date = new Date(yyyy,mm-1,dd,0,0,0,0);
    return mm===(date.getMonth()+1) && dd===date.getDate() && yyyy===date.getFullYear();
  }
  catch(er) {
    return false;
  }
}, 'Please use format DD MM YYYY.');

  ...
  rules: {
    "passport-doi-dd": {
      required: false,
      validDate: true,
      range: [1, 31]
    }, 
    "passport-doi-mm": {
      required: false,
      validDate: true,
      range: [1, 12]
    }, 
    "passport-doi-yyyy": {
      required: false,
      validDate: true,
      range: [1990, 2012]
    }
  },
  messages: {
    "passport-doi-dd": "Please use format DD MM YYYY.",
    "passport-doi-mm": "Please use format DD MM YYYY.",
    "passport-doi-yyyy": "Please use format DD MM YYYY."
  }

你走在正确的道路上——你需要通过Date构造函数数字而不是字符串(val将返回字符串)。您还可以利用params自定义规则的参数,使其更具可扩展性(不特定于具有特定的三个字段)ids):

$.validator.addMethod("multidate", function (value, element, params) {
  var daySelector = params[0]
      , monthSelector = params[1]
      , yearSelector = params[2]
      , day = parseInt($(daySelector).val(), 10)
      , month = parseInt($(monthSelector).val(), 10)
      , year = parseInt($(yearSelector).val(), 10)
      , date = new Date(year, month, day);

  return (!$(daySelector).val() && !$(monthSelector).val() && !$(yearSelector).val()) || 
    !isNaN(date.getTime());

});


$(document).ready(function () {
  var dateFields = ["#passport-doi-1", "#passport-doi-2", "#passport-doi-3"];
  $("#dateform").validate({
    errorLabelContainer: "#errors",
    groups: {
      date: dateFields.join("")
    },
    rules: {
      "passport-doi-1": {
        multidate: dateFields
      },
      "passport-doi-2": {
        multidate: dateFields
      },
      "passport-doi-3": {
        multidate: dateFields
      }
    },
    messages: {
      "passport-doi-1": {
        multidate: "Please enter a valid date"
      },
      "passport-doi-2": {
        multidate: "Please enter a valid date"
      },
      "passport-doi-3": {
        multidate: "Please enter a valid date"
      }
    }
  });
});

I think the group选项仅用于分组错误信息(因此您仍然必须为每个输入定义验证规则)。

Example: http://jsbin.com/oqawaz/9 http://jsbin.com/oqawaz/9

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何验证 3 个字段中的日期输入? 的相关文章

  • 使用 Google Autocomplete API 根据位置名称获取纬度和经度

    我的页面中有一个文本框 它获取位置名称和带有文本的按钮getLat Long 现在点击我的按钮我必须显示一个警报latitude and longitude文本框中的位置 有什么建议吗 您可以使用谷歌地理编码服务 http code goo
  • 在 ExpressJS 中通过管道传送远程文件

    我想读取远程图像并显示它 我可以保存文件 但无法正确显示代码 理想情况下 我只想直接传递文件而不进行处理 不确定是否需要 tmp 文件步骤 此代码不显示任何内容 没有错误 我也尝试了 res pipe response var url ht
  • 等待 JavaScript 中 Json 调用完成

    我正在使用下面的json调用在我的 javascript 方法中 function go123 var cityName var temp getJSON https abc in api city callback args functi
  • 将数组中的所有值作为参数传递给函数

    我有一个值数组 a b c d 我需要将它们作为参数传递给函数 window myFunction a b c d 如果我可以将数组 对象传递到函数中 那么这会更容易 但这些函数是由其他人编写的或已经存在 我无法更改它们 它们需要作为单独的
  • 为具有可变内容的内联块元素提供相同的高度?

    我有 4 个宽度固定但内容可变的内联块元素 并且我希望所有这些元素具有相同的高度 最大元素的高度 请参见这个jsfiddle http jsfiddle net kKZXj 我应该如何实现这个目标 如果仅使用 css 无法做到这一点 那么使
  • 这个特定的 ReactJs 代码是如何执行的初学者问题?

    我是初学者 正在阅读大量代码 现在我想知道下面的代码我明白这段代码在做什么 我需要澄清的是代码流程 当我运行它时 我看到图像正在加载 React 是从上到下执行代码吗 占位符图像异步获得正确的图像 但会App如果需要时间 组件会开始渲染但没
  • 如何使用 jquery 从 iframe 内部滚动?

    我正在使用一个 Shadowbox 它生成一个 iframe 以在页面上显示产品详细信息 由于详细信息页面可能相当长 因此客户端需要一个 更多 按钮来向下滚动页面 显然 iframe 右侧的滚动条还不够 这是我为了让 iframe 滚动而尝
  • 是否可以用 json 进行表达式/计算?

    我使用出色的 json server 作为应用程序的后端 它对于访问自定义端点以检索一些数据非常有用 但是如果它允许我进行计算 表达式以便我也可以模仿后端行为 那将会非常有用 以这个数据结构为例 products name football
  • GeoJSON 要素坐标未显示在 OpenLayers 地图上

    我正在尝试显示一个GeoJSON地图上的多边形 我使用了 OpenLayers 提供的示例以及以下数据 但仅显示第二个多边形 var geojsonObject type FeatureCollection crs type name fe
  • Angular 2 最终版本路由器单元测试

    如何使用 karma 和 jasmine 对 Angular 2 0 0 版中的路由器进行单元测试 这是我的旧单元测试在版本 2 0 0 beta 14 中的样子 import it inject injectAsync beforeEac
  • 向 FTP 服务器执行跨域 XMLHTTPREQUEST 的语法是什么?

    我有一个 webDav CORS 插件 可以使用它在 webDav 服务器上 POST PUT GET REMOVE ALLDOCS 文件 我现在想对 FTP 做同样的事情 但我正在努力获取xmlhttprequest 工作语法 我只是收到
  • 如何获取调用函数的“this”值?

    如果我有一个这样的函数 function foo this console log this function bar bar prototype func function foo this var test new bar test f
  • RxJS - 从可观察对象中获取最后 n 个元素

    我想从可观察对象中获取最后 3 个元素 假设我的时间线是这样的 a b c d e f g h i j gt where a b c d e f g h i j are emitted values 每当发出新值时 我想立即获取它 因此它可
  • Firefox OS 后台服务

    我想构建一个应用程序 用户可以通过它输入一些设置 并且应用程序将启动后台服务来根据这些设置执行一些任务 我只想在模拟器中运行应用程序和后台服务 我知道它需要 认证 模式才能运行后台服务 但我现在不考虑在 Firefox Marketplac
  • HTML if 语句在 CDN 失败时加载本地 JS/CSS

    当从 CDN 或任何外部服务器加载 CSS JS 文件时 有可能 即使概率很低 由于外部故障而丢失该文件 在这种情况下 html 页面将因缺乏适当的 CSS 和 JS 而被损坏 有没有一种实用的方法可以在 CDN 故障时加载本地版本 IF
  • 如何获取 svgElement 的比例?

    我正在研究 svg div style width 300 height 300 div
  • 用于客户端存储和服务器端同步的javascript库[关闭]

    Closed 这个问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我正在寻找一个 javascript 库 它可以让我将数据存储在客户端数据库中 并在后台自动将数据库同
  • Safari 的 Javascript 与 document.write 的问题

    我的问题只发生在 Safari 上 IE FF Chrome 和 Opera 都可以完美运行 我正在向 DOM 添加一个对象 与 YouTube 的方式完全相同 具体取决于 ActiveX 或 NPAPI 因此在确定写入对象类型后 我通过以
  • JS中如何过滤多个字符串? [复制]

    这个问题在这里已经有答案了 我希望能够过滤数组中的多个字符串 类型 例如我想过滤类型meat并输入fruit在下面的数据结构中 我想要实现的是过滤数据对象 const data type meat food hamburger type f
  • 垃圾收集器不适用于 NodeJS / Chrome 中的类型化数组

    我最初将其记录为原项目中的一个问题 https github com nodejs help issues 3590 它立即转移到帮助主题 没有很好的解释 所以现在我想在这里提问 如果我们在 NodeJS v14 v16 v17 中运行以下

随机推荐

  • 连续循环页面(不是无限滚动)

    我正在寻找创建滚动功能的资源 例如在这些网站上找到的资源 前哨日记 http www outpostjournal org Unfold http unfold no 一旦滚动条到达页面底部 我希望它循环回到顶部 我对无限滚动很熟悉 但这不
  • Excel - 提取前 5 个值

    我想提取前 5 名选手基于每个员工的销售额 没有数据透视表 自动过滤器 参考我的输入和输出截图 Snapshot https i stack imgur com zYElg png 有什么建议 如何获得前 5 名排名 即使重复 如屏幕截图所
  • 相当于 XHR 或 Ajax 库中的 Fetch 'no-cors' 模式?

    有没有办法在现有的 大多数浏览器支持的 HTTP 请求中写入 fetch mode no cors 举个例子 我想知道是否可以翻译 fetch url mode no cors then function response console
  • Chrome 开发者工具工作区映射

    谁能告诉我 Chrome 开发者工具工作区映射是如何工作的 我相信目前它仅在加那利可用 我认为它应该允许我在元素视图中更改 CSS 规则 并将它们自动保存到本地文件中 正如 Paul Irish 在 Google IO 2013 上演示的那
  • 搅拌机谷歌Colab

    直到几天前 我还能够使用 GPU 在 Google Colab 上无头运行 Blender 或 sheshe it 是的 我检查了三次我选择了 GPU 实例 现在运行 keras tensorflow 确实工作正常 但 Blender 根本
  • TFS 中的错误、问题和任务之间有什么区别[关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 谁能给我一个关于 TFS 中错误 问题和任务之间差异的简短解释 For the Scrum TFS 流程模板 https msdn m
  • 无法从 aws lambda 层导入模块

    我有一个 pip 包的需求文件 我将其安装在目标文件夹中并压缩内容并将其上传到 AWS lambda 层 要求 txt asgiref 3 2 3 certifi 2019 11 28 chardet 3 0 4 cloudevents 0
  • 根据 Pandas 中的多个条件过滤分组行

    给定一个数据框如下 city district date price 0 bj cy 2019 03 01 NaN 1 bj cy 2019 04 01 6 0 2 sh hp 2019 03 01 4 0 3 sh hp 2019 04
  • 带有嵌套对话框的选项卡控件中的选项卡顺序 (WS_EX_CONTROLPARENT)

    在 Win32 API C 项目中 我有一个带有选项卡控件 3 个选项卡 的对话框和作为该选项卡控件的子项的 3 个对话框 我使用 DialogBoxParam 加载带有选项卡控件的主对话框 并使用 CreateDialogParam 从资
  • UIPickerview 组件中带有标签的图像

    我的 UIPickerView 有两列 在一列中我想在其旁边显示图像和标签 有用 显示和图像和标签 只是标签在图像下面如何将图像放在左侧 标签放在右侧 我尝试将标签更改为右对齐 但它不起作用 UIView pickerView UIPick
  • 如何添加全局动作事件监听器?

    如何添加全局动作事件监听器 我试过了 Toolkit getDefaultToolkit addAWTEventListener this AWTEvent ACTION EVENT MASK 但它不起作用 示例 要侦听应用程序中的所有 M
  • FileNotFoundException 打开失败:在 Android 上将图像文件保存到内部存储期间 EPERM(不允许操作)

    当我尝试将图像保存到 Android 上的内部存储时 我遇到了这个问题 public static String setImage Bitmap image if image null FileOutputStream outputStre
  • Tkinter Optionmenu 小部件中相同值的索引

    我正在尝试访问选项菜单小部件中相同值的索引 在下面的代码中 无论我选择两个 b 字符中的哪一个 列表中的字符 b 都会返回索引 1 我需要根据列表中的索引位置区分两个 b 字符 即从选项菜单小部件中选择第一个 b 应返回索引 1 而第二个
  • 如何在Android中读取套接字输入流

    can anybody tell me how to read socket input stream Here is my code if serverIpAddress equals try InetAddress serverAddr
  • 在源代码管理中存储 SSL 证书

    只要您不存储私钥 将 Web 应用程序的 SSL 证书存储在源代码存储库中是否会存在安全问题 使用源代码管理来备份此类内容是多么容易 我有点被宠坏了 并且想充分利用它 但我也不想草率地使用它 或危及安全 不需要 证书是公开的 服务器将在每次
  • 在 golang HTTP FileServer 中设置 Content-Type 标头的 'charset' 属性

    我在测试 golang Web 应用程序时遇到问题 在部署版本中 nginx 位于应用程序前面并显式设置charset utf8 以便所有文本类型都附加字符集声明 在测试中 我直接访问 golang 应用程序 这里的内容类型没有字符集集 当
  • Intent.putExtras 不一致

    我的 AlarmManager 遇到了一个奇怪的情况 我正在使用 AlarmManager 安排一个事件 并使用intent putExtra 传入一个字符串 琴弦要么静音 要么振动 当接收器触发时 手机应该关闭铃声或将手机设置为振动 日志
  • NHibernate 一对一关系

    我有以下内容Domain Model s public class WriteOffApprovalUser public virtual string UserName get set public virtual Employee Em
  • 使用 git add --patch 手动编辑

    因此 我在分支 A 中得到了一个一直在处理的文件 并且我正准备提交它 但是 查看差异 我认为最好将其放入两个单独的提交中 好吧 在这种情况下 也许是两个单独的分支 我之前使用过 git add patch 来暂存单独的帅哥 所以我想我可以使
  • 如何验证 3 个字段中的日期输入?

    我有 3 个用于日期输入的字段