HTML – Javascript 應用

Posted on 十二月 29, 2007 by brain

一般在撰寫 html 網頁表單時，會需要處理一些表單內容的檢查動作！

最簡單的方是就是運用 Javascript 技術來達成！


Javascript 的撰寫部分 一般都放在 網頁的 <head>…</head>中

以 <script type=”text/javascript”> 開頭 </script> 做結尾

中間插入

function checkform()
{
	if(document.form.name.value==''){
		alert("Fill out name field please!");
		document.form.name.focus();
		return(false);
	}
	else if(document.form.email.value==''){
		alert("Fill out e-mail field please!");
		document.form.name.focus();
		return(false);
	}
	else if(document.form.suggestion.value==''){
		alert("Fill out suggesstion field please!");
		document.form.name.focus();
		return(false);
	}
	return(true);
}

的 function 來定義函示Form 表單中開頭

<form action=”mail.php” method=”post” name=”form1″ id=”form1″ onSubmit=”return checkform(this)”>

的 onSubmit() 用來檢查 form 表單

如果 checkform() 傳回 false 則不處理表單的 action 動作(POST to mail.php), 反之則處理…

而 checkform(this) 這支 javascript 就是在做檢查是否表單中之必要欄位有被填寫…

其中 form 為表單名 name, email, suggestion 則為欄位名稱

如果要在點下 “submit” 按鈕時做檢查（觸發事件）則可以加入下面

<input type=”submit” name=”Submit2″ value=”送出” onclick=”disp_alert(checkformback())”) />

其中 onclick 即為觸發動作

Javascript function -> disp_alart() 如下


function disp_alart(value){
	if(value) {
		alart("suggestion has been send !");
	}
	else{
		//    do nothing
	}
}

onclick 會依 checkformback()之回傳值丟入 disp_alart(BOOL value)中再做處理！

如果欄位檢查都填寫了 則傳入 TRUE 執行 disp_alart() 否則 do nothing !

存放在: 技術相關 | 屬於此標籤： , ,

« »

留言