萬盛學電腦網 >> 網頁制作 >> 腳本Html教程 >> html編寫簡潔的頁面表單驗證程序
html編寫簡潔的頁面表單驗證程序
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "1/DTD/xhtml1-transitional.dtd";>
<html xmlns="";>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>vForm表單驗證程序</title>
<style type="text/css">
<!--
{
width: 170px;
overflow:visible;
height:auto;
font-size: small;
position: absolute;
background-color: #FFffdd;
border: 1px solid #000;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#111111,direction=135,strength=3);
top: 375px;
padding: 5px;
left: 671px;
}
_title
.err{
padding: 5px;
height: 50px;
width: 24em;
position: absolute;
background-color: #FFFFCC;
left: 196px;
top: 114px;
font-size: small;
opacity:0.5;
border: 1px double #333333;
filter: Shadow(Color=#000000, Direction=135);
filter:progid:DXImageTransform.Microsoft.Shadow(color=#111111,direction=135,strength=5);
}
#form1 .text_input {
border-top: 1px solid #333333;
border-right: 1px solid #999999;
border-bottom: 1px solid #ddd;
border-left: 1px solid #000000;
}<_title {
color: #FF0000;
background: #ACB9D1;
}
#form1 {
position: static;
left: 581px;
top: 463px;
border: 1px solid #3300FF;
padding: 5px;
;
}
#imok {
display: block;
position: absolute;
height:315px;
overflow:scroll;
left: 100px;
top: 100px;
width: 306px;
}
.title h1 {
background: #33CCFF;
border-bottom: medium solid #3366FF;
}
.title p {
font-size: medium;
text-indent: 2em;
}
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: medium;
}
code {
font: 12px/18px "lucida Grande", verdana, lucida, Arial, helvetica, "宋體", sans-serif;
border:1px solid #0099cc;
padding:5px;
margin: 5px;
width: 80%;
color: #000;
background-color: #ddedfb;
display: block;
}
-->
</style>
<script language="JavaScript" type="text/javascript">
//程序基本思路：通過擴展對象來實現，將String擴展 將默認的表單元素擴展 定義兩個自定義對象。
//String.isEmail
//String.isUrl
//表單元素.required
//表單元素.isvalid
//表單元素.validate
//
//字符串驗證擴展
//├電子郵件驗證
String.prototype.isEmail = function(){
var tmpStr = this;
var email = /^w+([-+.]w+)*@w+([-.]w+)*.w+([-.]w+)*$/;
return email.test(tmpStr)
}
//├http地址驗證
String.prototype.isUrl = function(){
var url = ///[A-Za-z0-9]+.[A-Za-z0-9]+[/=?%-&_~`@[]':+!]*([^<>""])*$/;
var tmpStr = this;
return url.test(tmpStr);
}
//├日期驗證（第一部分）
String.prototype.isDateTime = function(){
if(Date.parse(this) Date.parseDate(this))
{
return true;
}
else
{
return false;
}
}
String.prototype.isInteger = function()
{
var _i = /^[-+]?d+$/;
var _s = this;
return _i.test(_s);
}
Date.prototype.toIsoDate = function()
{
var _d = this;
var _s;
_Y =_d.getFullYear();
_M = _d.getMonth() + 1;
_D = _d.getDate();
_H = _d.getHours();
_I = _d.getMinutes();
_S = _d.getSeconds();
with(_d)
{
_s = [getMonth() + 1,getDate(),getHours(),getMinutes(),getSeconds()];
}
for(var i = 0; i < _s.length; i++)
{
if (_s[i].toString().length == 1)_s[i]= '0'+_s[i];
}
return (_Y + '-'+_s[0]+'-'+_s[1]+' '+_s[2]+':'+_s[3]+':'+_s[4])
}
//├日期驗證（第二部分）
Date.parseDate = function(str, fmt) {
fmt = fmt "%Y-%m-%d %H:%M";
var today = new Date();
var y = 0;
var m = -1;
var d = 0;
var a = str.split(/W+/);
var b = fmt.match(/%./g);
var i = 0, j = 0;
var hr = 0;
var min = 0;
for (i = 0; i < a.length; ++i) {
if (!a[i])
continue;
switch (b[i]) {
case "%d":
case "%e":
d = parseInt(a[i], 10);
break;
case "%m":
m = parseInt(a[i], 10) - 1;
break;
case "%Y":
case "%y":
y = parseInt(a[i], 10);
(y < 100) && (y += (y > 29) ? 1900 : 2000);
break;
case "%b":
case "%B":
for (j = 0; j < 12; ++j) {
if (Calendar._MN[j].substr(0, a[i].length).toLowerCase() == a[i].toLowerCase()) { m = j; break; }
}
break;
case "%H":
case "%I":
case "%k":
case "%l":
hr = parseInt(a[i], 10);
break;
case "%P":
case "%p":
if (/pm/i.test(a[i]) && hr < 12)
hr += 12;
else if (/am/i.test(a[i]) && hr >= 12)
hr -= 12;
break;
case "%M":
min = parseInt(a[i],</p><div align='left'><b><div id=pages style='float:left;border:1px solid #39f;text-align:center;WIDTH: 30px;HEIGHT: 20px;background-color:#eee;padding:2px;margin:5px;margin-right:0;'><font color='red'>1</font></div><div id=pages style='float:left;border:1px solid #39f;text-align:center;WIDTH: 30px;HEIGHT: 20px;background-color:#eee;padding:2px;margin:5px;margin-right:0;' ><a '>2</a></div><div id=pages style='float:left;border:1px solid #39f;text-align:center;WIDTH: 30px;HEIGHT: 20px;background-color:#eee;padding:2px;margin:5px;margin-right:0;' ><a '>3</a></div><div id=pages style='float:left;border:1px solid #39f;text-align:center;WIDTH: 30px;HEIGHT: 20px;background-color:#eee;padding:2px;margin:5px;margin-right:0;' ><a '>4</a></div><div id=nextpage style='float:left;border:1px solid #39f;text-align:center;WIDTH: 55px;HEIGHT: 20px;background-color:#eee;padding:2px;margin:5px;'><a '>.</a></div> </b></div>
</DIV>
<DIV class="mycontent3"><IFRAME src="' title='文章標題：分析總結一下＜li＞和＜hr＞的樣式定義
作 者：html教程
更新時間：2008-2-22 1:54:18'>分析總結一下＜li＞和＜hr＞的樣式定義</a></li></LI>
<LI><li>下一篇文章： <a class='LinkNextArticle' ' title='文章標題：網頁中插入透明Flash的要領和技巧
作 者：html教程
更新時間：2008-2-22 1:54:19'>網頁中插入透明Flash的要領和技巧</a></li></LI>
</UL>
</DIV>
<DIV class=soft_intro><script language='javascript' src='/AD/200504/13.js'></script></DIV>
<DIV class=soft_introPIC><table width='100%' cellpadding='0' cellspacing='5' border='0' align='center'><tr valign='top'><td align='center'><a class="" ; title="PS打造 Sinsuo非主流效果+頹廢美化照片" target="_blank"><img class='pic1' src='"; title="PS打造 Sinsuo非主流效果+頹廢美化照片" target="_blank">PS打造 Sinsuo非主流效果+頹廢美化照片</a></td><td align='center'><a class="" ; title="非主流照片打造教程 之大眼睛MM" target="_blank"><img class='pic1'
- 上一頁:網頁打造中段落縮進的5種解決要領
- 下一頁:網頁設計注意的問題
