如何在信用卡表格中验证到期日期？

Question

我是 Web 开发的初学者，我必须以 MM-DD-YYYY 的格式在表单中提交我的信用卡的到期日期。我编写了一些代码来识别字符串是否采用这种特定格式。但是我想检查日期是否已经过期并且小于我们拥有的当前日期并专门检查格式中的每个元素（例如检查 MM > 12）。我希望您能帮助指导我解决这个问题任务。 先感谢您 。

我的代码：

function checkdate(){

 var dateReg = /^\d{2}([./-])\d{2}\1\d{4}$/ //MM-DD-YYYY format
 var date = document.getElementById("date");
 
 //i can just check if my element is date format
 if(!date.value.match(dateReg)){
    
	alert("not a date ");
	return false;
 
 }
 
 
 return true;
 

}

	<label for "expiration-date"> Card Expiration Date </label> 
	<input type = "text" name = "exp-date" id = "date" placeholder = "MM/DD/YYYY" required>

<button type = "submit" class = "submitbtn" onclick= "return checkdate()">Submit</button> 

Answer 1

您可以将字符串转换为Date 对象并使用< 和> 运算符将其与当前日期进行比较。

<label for "expiration-date"> Card Expiration Date </label> 
<input type = "text" name = "exp-date" id = "date" placeholder = "MM/DD/YYYY" required>

<button type = "submit" class = "submitbtn" onclick= "return checkdate()">Submit</button>

<script>
  function checkdate(){
    var dateReg = /^\d{2}([./-])\d{2}\1\d{4}$/ //MM-DD-YYYY format
    var date = document.getElementById("date");
    var expDate = new Date(date.value)
    var currDate = new Date()

    if (!date.value.match(dateReg)) {
      alert("not a date ");
      return false;
      
    } else if (expDate < currDate) {
      alert("Card expired");
      return false;
    }

    return true;
  }
</script>

Answer 2

您可以解析日期并将其与当前日期进行比较。

function checkdate(){

 var dateReg = /^\d{2}([./-])\d{2}\1\d{4}$/ //MM-DD-YYYY format
 var date = document.getElementById("date");
 
 //i can just check if my element is date format
 if(!date.value.match(dateReg)){
    
	alert("not a date ");
	return false;
 
 }else{
  const date1 = new Date(date.value);
  const date2 = new Date();
  const diffTime = (date2 - date1);
  const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
  
  if(diffDays > 0){
      alert("card expired");
  }else{
    alert("card valid");
  }
   
 }
 
 
 return true;
 

}

<label for "expiration-date"> Card Expiration Date </label> 
	<input type = "text" name = "exp-date" id = "date" placeholder = "MM/DD/YYYY" required>

<button type = "submit" class = "submitbtn" onclick= "return checkdate()">Submit</button>

Answer 3

我认为这段代码会对你有所帮助

function checkdate(){
var dateReg = /^\d{2}([./-])\d{2}\1\d{4}$/ //MM-DD-YYYY format
 var date = document.getElementById("date");
 
 //i can just check if my element is date format
 if(!date.value.match(dateReg)){
  
	alert("not a date ");
	return false;
 
 }else{
   var todaydate = new Date();
   todaydate = todaydate.setHours(0,0,0,0);
   console.log(todaydate);
   console.log(date.value)
   console.log(new Date(date).setHours(0,0,0,0));
   if(new Date(date.value).setHours(0,0,0,0)<todaydate){
    alert("entered date is less than today date");
   } else{
    alert("entered date is greater than today date");
   }
 }
 
 
 return true;
 

}

	<label for "expiration-date"> Card Expiration Date </label> 
	<input type = "text" name = "exp-date" id = "date" placeholder = "MM/DD/YYYY" required>

<button type = "submit" class = "submitbtn" onclick= "return checkdate()">Submit</button> 

认为下面的代码会对你有所帮助。

Answer 4

var current_date = new Date();
if ((current_date.getDay() > date.getDay()) && (current_date.getFullYear() > date.getFullYear()) && (current_date.getMonth() > date.getMonth()))
{
alert("Expired ");
}

Answer 5

您可以将日期拆分为一个数组，以便根据您的验证需求轻松实现与每个日期成员的比较：

const array = data.split('-').map(v => Number(v)) // [M, D, Y]