html:
<form ?onsubmit="return validate_form(this);" method="post">
? ? ? ? ? ? email:<input type="text" name="email" >
? ? ? ? ? ?<input type="submit" value="submit">
</form>
js:
function validate_email(field,alerttxt)//這個函數用來驗證email的格式是否滿足xxx@xxx.xxx的格式,其中要求@前面必須要至少一個字符,@與.之間至少要有一個字符
{
? ? ? ? with (field)//使用with (XXX)語句是指定默認對象,這樣在訪問這個HTML元素(就是這里的field)的值的時候,就不需要指定對象了,可以直接使用value.indexOf。否則的話,需要field.value.indexOf
? ? ? ? ?{
? ? ? ? ? ? ? ? ? ? ? ? ? apos=value.indexOf("@");//找到第一個@的位置。如果找不到的話,apos值為-1,找到的話就是@在字符串里面的以0開始的位置索引
? ? ? ? ? ? ? ? ? ? ? ? ? dotpos=value.lastIndexOf(".")//找到最后一個.的位置
? ? ? ? ? ? ? ? ? ? ? ? ? if (apos<1||dotpos-apos<2)//如果找不到@或者@是第一個字符(apos<1),或者@之后沒有.或者@與.之間沒有任何字符(dotpos-apos<2)
? ? ? ? ? ? ? ? ? ? ? ? ? {alert(alerttxt);return false}//彈出對話框顯示錯誤消息并返回假表明驗證email格式失敗
? ? ? ? ? ? ? ? ? ? ? ? ? else {return true}//否則返回真
? ? ? ? ?}
}
function validate_form(thisform)//這個函數用來在表單提交時對表單做驗證,通常的使用方式是表單里面有個提交按鈕在點擊時調用這個函數,如下例所示,當這個函數返回假的時候,表單不會提交
?{
? ? ? ? ? ? ? with (thisform)
? ? ? ? ? ? ?{
? ? ? ? ? ? ? ? ? ? ? ? ? if (validate_email(email,"請輸入正確的郵件地址!")==false);//調用validate_email來驗證表單中的email這個字段 ,判斷是否失敗
? ? ? ? ? ? ? ? ? ? ? ? ? {email.focus();return false}//如果失敗的話,讓email獲得焦點,同時返回假使的表單不提交
? ? ? ? ? ? ?}
}