圖靈叢書例子:檢查日期格式

參照圖靈叢書上面的檢查日期格式例子,其中html代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
<script type="text/javascript" src="checkdate.js"></script>
<style type="text/css">
.error{
	color:#c00;
	font-weight:bold;
}
</style>
</head>

<body>
<h1>Event Search</h1>
<form action="Js_2.html" method="post" οnsubmit="return checkDate();">
	<p>
    	<label for="date">Date in format DD/MM/YY:</label><br />
        <input type="text" id="date" name="date" />
        <input type="submit" value="Check" />
		<!-- 注意此處span標籤中間有一個空格-->
        <br />(example 24/04/1975)<span class="error"> </span>
    </p>
</form>
</body>
</html>

checkdate.js部分代碼如下:

// JavaScript Document
function checkDate(){
	if(!document.getElementById || !document.createTextNode){return;}
	var dateField = document.getElementById('date');
	if(!dateField){return;}
	var errorContainer = dateField.parentNode.getElementsByTagName('span')[0];
	if(!errorContainer){return;}
	var checkPattern = new RegExp("\\d{2}/\\d{2}/\\d{4}");
	var errorMessage = '';
	errorContainer.firstChild.nodeValue = ' ';
	var dateValue = dateField.value;
	if(dateValue == ''){
		errorMessage = 'Please provide a date.';
	}else if(!checkPattern.test(dateValue))
	{
		errorMessage = 'Please provide the date in the defined format.';
	}
	if(errorMessage!=' ')
	{
		errorContainer.firstChild.nodeValue = errorMessage;
		dateField.focus();
		return false;
	}else{
		return true;
	}
}



 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章