Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >HTML的JavaScript日期验证

HTML的JavaScript日期验证
EN

Stack Overflow用户
提问于 2018-07-20 23:43:11
回答 4查看 108关注 0票数 0

我目前正试图在一个网站上创建一个表单,其中一个人在提交表单之前填写一个日期。如果用户在今天之前输入日期,它将不会提交表单并发出一个声明为"Date cannot be before today"的警告。

然而,我遇到了一个问题,我的JavaScript算法是错误的,我无法找出是什么导致了这个问题。问题是:日期不重要,用户可以从表单中从2020-01-01输入maxlength下面的任何日期(JavaScript不工作)

代码语言:javascript
运行
AI代码解释
复制
function checkForm() {
  var answ = validateDate(document.getElementById("doa").value);
  if (answ == false) {
    return false;
  }
  return true;
}

function validateDate(doa) {
  var d = new Date(doa);
  var n = new Date();
  if (d <= n) {
    alert("Date cannot be before today");
    return false;
  }
  return true;
}

我的表格:

代码语言:javascript
运行
AI代码解释
复制
<form action="advertResult.html" onsubmit="return checkForm()">
  <label class="formText">First Name:</label>
  <input type="text" id="firstName" name="firstname" placeholder="" required>

  <label class="formText">Last Name:</label>
  <input type="text" id="lastName" name="lastname" placeholder="" required>

  <label for="commission" class="formText">Type of Commission</label>
  <select id="commission" name="commission" required>
    <option value="drawing">Art</option>
    <option value="video">Video</option>
  </select>

  <label for="doa" class="formText">Select a date for discussion</label>
  <input type="date" name="date" id="doa" max="2020-01-01" required>

  <input type="submit" value="Submit">
</form>
EN

回答 4

Stack Overflow用户

回答已采纳

发布于 2018-07-21 00:13:18

HTML代码引用全局函数checkForm,而JS代码可以通过多种方式定义。

除非它是由一个旧的<script>标记(直接在HTML中或使用src属性)所包含的,否则包含JS的方式(例如使用webpack)可能会将函数转换为本地函数,并且不会定义全局checkForm

在这种情况下,您可以定义一个全局函数(http://jsfiddle.net/w1m6c7v0/7/):

代码语言:javascript
运行
AI代码解释
复制
window.checkForm = function() {
  ...

或者更好的是,在JS中添加事件侦听器(http://jsfiddle.net/w1m6c7v0/6/,但如果有多个表单,则使用id属性):

代码语言:javascript
运行
AI代码解释
复制
document.querySelector('form').onsubmit = checkForm
function checkForm() {
  ...
票数 1
EN

Stack Overflow用户

发布于 2018-07-21 00:01:52

更新代码以执行日期检查。

代码语言:javascript
运行
AI代码解释
复制
function checkForm() {
  return validateDate(document.getElementById("doa").value);
}

function validateDate(doa) {
  var d = new Date(doa);
  var n = new Date();
  return (d.getFullYear() >= n.getFullYear()) &&
    (d.getMonth() >= n.getMonth()) &&
    (d.getDate() >= n.getDate());
}
票数 1
EN

Stack Overflow用户

发布于 2018-07-21 00:18:25

您可以使用moment.js库:https://momentjs.com/

代码语言:javascript
运行
AI代码解释
复制
if(moment(doa)).isBefore())
  return false;
return true;

如果没有任何东西传递给moment#isBefore,它将默认为当前时间。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51453962

复制
相关文章
JavaScript 日期
JavaScript 日期 JavaScript 日期输出 默认情况下,JavaScript将使用浏览器的时区并将日期格式显示为全文本字符串: Tue Apr 02 2019 09:01:19 GMT+0800 创建 Date 对象 Date对象由 Date() 构造函数创建 new Date() new Date():使用当前日期和时间创建新的日期对象: var date = new Date(); new Date(year,month,…) 格式:new Date(year,month,day,ho
Mirror王宇阳
2020/11/13
1.3K0
jeDate日期控件的验证
前面用到了jeDate日期控件的使用,https://www.jianshu.com/p/393d9e992144,在这个控件的基础上,做出一些完善:关于jeDate日期控件的验证的问题:
王小婷
2019/04/09
2K0
jeDate日期控件的验证
JavaScript日期处理
​ 当然,Github上提供了好多优秀的日期处理插件(如:Datejs、date-fns、jquery-dateFormat),然而当处理一些简单的日期操作去引用插件,还是挺耗费资源。
奋飛
2019/08/15
4.5K4
JavaScript|日期对象
在JavaScript中没有日期类型的数据,但我们在开发的过程中经常需要处理日期,所以在这里我将在这里给展示大家如何用日期对象(Date)来操作日期和时间。
算法与编程之美
2020/09/16
9940
JavaScript|日期对象
html表单验证确认密码_简述html5的表单验证
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
全栈程序员站长
2022/11/17
3.6K0
html表单验证确认密码_简述html5的表单验证
[译]HTML验证的价值探讨
[译]HTML验证的价值探讨 作者:Nicholas C. Zakas 原文:http://www.nczonline.net/blog/2010/08/17/the-value-of-html-validation/ 这篇文章我已经酝酿了很久,期间还拜读了 Chris Heilmann 关于 Remy Sharp’s site 的这篇大作。我和Chris曾就这个话题多次交换意见,最终我们彼此的观点都有所改变,接受了一些过去无法接受的意见。我曾经在公开的、私下的各种场合直言不讳地表示过,目前的HTML验证状
小李刀刀
2018/03/02
1K0
JavaScript 时间与日期
知识点: 1.Date类型 2.通用的方法 3.格式化方法 4.组件方法 JavaScript提供了Date类型来处理时间和日期。Date类型内置一系列获取和设置日期时间信息的方法。 一.Date类型 Date类型是在早期Java中java.util.Date类基础上构建的。为此,Date类型使用UTC (Coordinated Universal Time,国际协调时间[又称世界统一时间]) 1970年1月1日午夜(零时)开始经过的毫秒来保存日期。在使用这种数据存储格式的条件下,Dat
汤高
2018/01/11
1.9K0
JavaScript Date(日期) 对象
我们提供 JavaScript Date 对象参考手册,其中包括所有可用于日期对象的属性和方法。JavaScript Date 对象参考手册。
陈不成i
2021/07/20
1.4K0
JavaScript 验证 API
input 元素的 validity 属性包含一系列关于 validity 数据属性:
陈不成i
2021/07/19
6120
JavaScript 表单验证
JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证。
陈不成i
2021/07/19
3.3K0
JavaScript HTML DOM - 改变 HTML
今天的日期是: Mon Jul 19 2021 15:52:44 GMT+0800 (中国标准时间)
陈不成i
2021/07/20
4.5K0
javascript验证email
<html> <head> <title>test</title> <script language="javascript"> function emailCheck () { var emailStr=document.all.form1.tel.value; alert(emailStr); var emailPat=/^(.+)@(.+)$/; var matchArray=emailStr.match(emailPat); if (matchArray==null) {  alert("电子邮件地址必须包括 ( @ 和 . )")  return false; } return true; } </script> </head>
Java架构师必看
2021/03/22
1.1K0
HTML中的javascript交互
在Android开发中,越来越多的商业项目使用了Android原生控件与WebView进行混合开发,当然不仅仅就是显示一个WebView那么简单,有时候还需要本地Java代码与HTML中的javascript进行交互,Android也对交互做了很好的封装,所以很容易实现例如:点击网页中的按钮Android调用原生对话框,点击网页中的电话号码调用Android拨号APP。这篇给大家介绍下如何实现Android与HTML+JS的交互。 有的人可能不理解什么是javascript,可以简单理解为它在HTML中
xiangzhihong
2018/02/01
4.1K0
HTML中的javascript交互
html & CSS & JavaScript的学习
一、HTML 1. 概念: 是最基础的网页开发语言 * Hyper Text Markup Language 超文本标记语言 * 超文本: * 超文本是用超链接的方法,将各种不同空间的文字信息组织在一起的网状文本。 * 标记语言: * 由标签构成的语言。<标签名称> 如 html,xml * 标记语言不是编程语言 2. 快速入门: * 语法: 1. html文档后缀名为.html或者 .htm 2. 标签分为:
Rochester
2020/09/01
6.1K0
JavaScript HTML DOM
当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model)。
陈不成i
2021/07/19
7700
Javascript日期时间总结(转)
从后台返回的C#时间为:/Date(-62135596800000)/,这个是C#的DateTime.MinValue; 要在html页面展示,一个方法是后端先处理成yyyy-MM-dd HH:mm:ss的格式,前端直接展示。 如果后端不做处理,就需要前端来做处理了,下面就是看前端处理的这种情况。
山河木马
2019/03/05
4.9K0
Javascript日期时间总结(转)
正则表达式-日期验证和邮箱验证
日期验证 $pattern='/^\d{4}[-](0?[1-9]|1[012])[-](0?[1-9]|[12][0-9]|3[01])$/'; 邮箱验证 $pattern='/^[a-zA-Z
week
2018/08/24
2K0
JavaScript 的表单或邮箱验证
JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证。 被 JavaScript 验证的这些典型的表单数据有: 用户是否已填写表单中的必填项目? 用户输入的邮件地址是否合法? 用户是否已输入合法的日期? 用户是否在数据域 (numeric field) 中输入了文本?
用户1503405
2021/10/08
1.9K0
JavaScript表单约束验证
我们在采集用户输入内容的时候肯定是需要判断用户输入的内容是否为我们需要的内容,js中有很多Api可以辅助我们来约束用户输入正确内容。
大熊G
2022/11/14
8030
JavaScript表单约束验证
HTML5-输入验证
HTML5引入了对输入验证的支持。设计者可告知浏览器自己需要什么类型的数据,然后浏览器在提交表单之前会使用这些信息检查用户输入的数据是否有效。其好处是:用户可以立刻得到问题反馈。
奋飛
2021/08/30
1.6K0
HTML5-输入验证

相似问题

Javascript日期验证?

12

Javascript日期验证

40

Javascript日期验证

40

JavaScript -验证日期

110

javascript日期验证

11
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档