表單源碼
『壹』 找一個表單代碼。
支持鍵盤事件,支持自動添加"http://",敲入www.hit.e.cn,回車試一下!
<script language="javascript">
function openUrl(){
var aUrl = document.getElementById('url').value;
if(aUrl.indexOf('http://') == -1){
aUrl = 'http://' + aUrl;
}
window.open(aUrl);
}
function keyDown(evt){
if(evt.keyCode == 13){
openUrl();
}
}
</script>
<form>
<input size="120" onkeydown="keyDown(event)" type=text id=url>
<input type="button" value="打開網頁" onclick="openUrl()">
</form>
『貳』 做這個表單的源代碼
想看源代碼可以直接右鍵點擊「查看網頁源代碼」
『叄』 表單的代碼
<form></form>
功能:用於申明表單,定義採集數據的范圍,也就是<form>和</form>裡麵包含的數據將被提交到伺服器或者電子郵件里。
語法:<FORM ACTION=URL METHOD=GET|POST ENCTYPE=MIME TARGET=...>. . .</FORM>
屬性解釋見下表:
action=url用來指定處理提交表單的格式.它可以是一個URL地址(提交給程式)或一個電子郵件地址.
method=get或post指明提交表單的HTTP方法.可能的值為: post:POST方法在表單的主幹包含名稱/值對並且無需包含於action特性的URL中. get:不贊成。GET方法把名稱/值對加在action的URL後面並且把新的URL送至伺服器.這是往前兼容的預設值.這個值由於國際化的原因不贊成使用.
enctype=cdata指明用來把表單提交給伺服器時(當method值為post)的互聯網媒體形式.這個特性的預設值是application/x-www-form-urlencoded
TARGET=...指定提交的結果文檔顯示的位置: _blank :在一個新的、無名瀏覽器窗口調入指定的文檔; _self :在指向這個目標的元素的相同的框架中調入文檔; _parent :把文檔調入當前框的直接的父FRAMESET框中;這個值在當前框沒有父框時等價於_self; _top :把文檔調入原來的最頂部的瀏覽器窗口中(因此取消所有其它框架);這個值等價於當前框沒有你框時的_self.
例如:
表示表單將向以post的方式提交,提交的結果在新的頁面顯示,數據提交的媒體方式是默認的application/x-www-form-urlencoded方式;
表單域
表單域包含了文本框、多行文本框、密碼框、隱藏域、復選框、單選框和下拉選擇框等,用於採集用戶的輸入或選擇的數據,下面分別講述這些表單域的代碼格式: 文本框是一種讓訪問者自己輸入內容的表單對象,通常被用來填寫單個字或者簡短的回答,如姓名、地址等。
代碼格式:<input type=text name=... size=... maxlength=... value=...>
屬性解釋:
type=text定義單行文本輸入框;
name屬性定義文本框的名稱,要保證數據的准確採集,必須定義一個獨一無二的名稱;
size屬性定義文本框的寬度,單位是單個字元寬度;
maxlength屬性定義最多輸入的字元數。
value屬性定義文本框的初始值
樣例1:
樣例1代碼:
<input type=text name=example1 size=20 maxlength=15 /> 也是一種讓訪問者自己輸入內容的表單對象,只不過能讓訪問者填寫較長的內容。
代碼格式:<TEXTAREA name=... cols=... rows=... wrap=VIRTUAL></TEXTAREA>
屬性解釋:
name屬性定義多行文本框的名稱,要保證數據的准確採集,必須定義一個獨一無二的名稱;
cols屬性定義多行文本框的寬度,單位是單個字元寬度;
rows屬性定義多行文本框的高度,單位是單個字元寬度;
wrap屬性定義輸入內容大於文本域時顯示的方式,可選值如下:
默認值是文本自動換行;當輸入內容超過文本域的右邊界時會自動轉到下一行,而數據在被提交處理時自動換行的地方不會有換行符出現; Off,用來避免文本換行,當輸入的內容超過文本域右邊界時,文本將向左滾動,必須用Return才能將插入點移到下一行; Virtual,允許文本自動換行。 Physical,讓文本換行,當數據被提交處理時換行符也將被一起提交處理。
樣例2:
樣例2代碼:
<TEXTAREA name=example2 cols=20 rows=2 wrap=PHYSICAL></TEXTAREA> 是一種特殊的文本域,用於輸入密碼。當訪問者輸入文字時,文字會被星號或其它符號代替,而輸入的文字會被隱藏。
代碼格式:<input type=password name=... size=... maxlength=...>
屬性解釋:
type=password定義密碼框;
name屬性定義密碼框的名稱,要保證數據的准確採集,必須定義一個獨一無二的名稱;
size屬性定義密碼框的寬度,單位是單個字元寬度;
maxlength屬性定義最多輸入的字元數。
樣例3:
樣例3代碼:
<input type=password name=example3 size=20 maxlength=15> 隱藏域是用來收集或發送信息的不可見元素,對於網頁的訪問者來說,隱藏域是看不見的。當表單被提交時,隱藏域就會將信息用你設置時定義的名稱和值發送到伺服器上。
代碼格式:<input type=hidden name=... value=...>
屬性解釋:
type=hidden定義隱藏域;
name屬性定義隱藏域的名稱,要保證數據的准確採集,必須定義一個獨一無二的名稱;
value屬性定義隱藏域的值
例如:<input type=hidden name=ExPws value=dd> 復選框允許在待選項中選中一項以上的選項。每個復選框都是一個獨立的元素,都必須有一個唯一的名稱。
代碼格式:<INPUT type=checkbox name=... value=...>
屬性解釋:
type=checkbox定義復選框;
name屬性定義復選框的名稱,要保證數據的准確採集,必須定義一個獨一無二的名稱;
value屬性定義復選框的值
樣例4:
樣例4代碼:
<input type=checkbox name=yesky value=09>xxxcom
<input type=checkbox name=Chinabyte value=08> 當需要訪問者在待選項中選擇唯一的答案時,就需要用到單選框了。
代碼格式:<input type=radio name=... value=...>
屬性解釋:
type=radio定義單選框;
name屬性定義單選框的名稱,要保證數據的准確採集,單選框都是以組為單位使用的,在同一組中的單選項都必須用同一個名稱;
value屬性定義單選框的值,在同一組中,它們的域值必須是不同的。
樣例5:
樣例5代碼:
<input type=radio name=myFavor value=1>
<input type=radio name=myFavor value=2> 有時候,需要用戶上傳自己的文件,文件上傳框看上去和其它文本域差不多,只是它還包含了一個瀏覽按鈕。訪問者可以通過輸入需要上傳的文件的路徑或者點擊瀏覽按鈕選擇需要上傳的文件。
注意:在使用文件域以前,請先確定你的伺服器是否允許匿名上傳文件。表單標簽中必須設置ENCTYPE=multipart/form-data來確保文件被正確編碼;另外,表單的傳送方式必須設置成POST。
代碼格式:<input type=file name=... size=15 maxlength=100>
屬性解釋:
type=file定義文件上傳框;
name屬性定義文件上傳框的名稱,要保證數據的准確採集,必須定義一個獨一無二的名稱;
size屬性定義文件上傳框的寬度,單位是單個字元寬度;
maxlength屬性定義最多輸入的字元數。
樣例6:
樣例6代碼:
<input type=file name=myfile size=15 maxlength=100> 下拉選擇框允許你在一個有限的空間設置多種選項。
代碼格式:
<select name=... size=... multiple>
<option value=... selected>...</option>
...
</select>
屬性解釋:
size屬性定義下拉選擇框的行數;
name屬性定義下拉選擇框的名稱;
multiple屬性表示可以多選,如果不設置本屬性,那麼只能單選;
value屬性定義選擇項的值;
selected屬性表示默認已經選擇本選項。
樣例7:
樣例7代碼:
<select name=mySel size=1>
<option value=1 selected></option>
<option value=d2></option>
</select>
樣例8:
按Ctrl可以多選
樣例8代碼:
<select name=mySelt size=3 multiple>
<option value=1 selected></option>
<option value=d2></option>
<option value=3></option>
</select> 表單按鈕控製表單的運作。
1.3.1 提交按鈕
提交按鈕用來將輸入的信息提交到伺服器。
代碼格式:<input type=submit name=... value=...>
屬性解釋:
type=submit定義提交按鈕;
name屬性定義提交按鈕的名稱;
value屬性定義按鈕的顯示文字;
樣例9:
樣例9代碼:
<input type=submit name=mySent value=發送>
1.3.2 復位按鈕
復位按鈕用來重置表單。
代碼格式:<input type=reset name=... value=...>
屬性解釋:
type=reset定義復位按鈕;
name屬性定義復位按鈕的名稱;
value屬性定義按鈕的顯示文字;
樣例10:
樣例10代碼:
<input type=reset name=myCancle value=取消>
1.3.3 一般按鈕
一般按鈕用來控制其他定義了處理腳本的處理工作。
代碼格式:<input type=button name=... value=... onClick=...>
屬性解釋:
type=button定義一般按鈕;
name屬性定義一般按鈕的名稱;
value屬性定義按鈕的顯示文字;
onClick屬性,也可以是其它的事件,通過指定腳本函數來定義按鈕的行為;
樣例11:
樣例11代碼:
<input type=button name=myB value=保存 onClick=javascript:alert('it is a button')>
二.表單
表單是用來提交資料、意見,規范流程執行過程的格式。
『肆』 誰能幫寫個簡單的html表單源代碼
這是以前在學校寫的 自己拿去改改吧
那個發郵件的指定到你郵箱的功能不是html能實現的餓- -!
<html>
<head>
<title>表單源碼</title>
<head>
<body bgcolor="#A0EEDC">
<form method="post" action="c:\" name="myform" enctype="multipart/form-data">
<table bgcolor="#DAB4F1" width="60%" height="70%" align="center" border="0" bordercolor="red" cellspacing="0" cellpadding="0">
<tr>
<td colspan="2" bgcolor="#A3C2E4" align="center" width="100%" >請完成以下表格</td>
</tr>
<tr>
<td align="right" width="30%">姓名 </td>
<td><input type="text" name="yhm" size="10" maxlength="15"/></td>
</tr>
<tr>
<td> </td>
<td align="left"><font size="2">請在此處填寫姓名,</font><br/><font face="黑體" color="#ff0000" size="3">字元最長為四個漢字,或八個英文字母</font><td>
</tr>
<tr>
<td align="right">性別 </td>
<td>
<input type="radio" name="xb" value="男"/>男
<input type="radio" name="xb" value="女"/>女
</td>
</tr>
<tr>
<td align="right">電子郵件地址 </td>
<td><input type="text" name="dzyj" size="40" maxlength="50"/></td>
</tr>
<tr>
<td align="right">職業</td>
<td>
<select name="zy">
<option value="0" selected>傳播/媒體 </option>
<option value="1">計算機/IT</option>
<option value="2">金融</option>
<option value="3">教育</option>
<option value="4">其他</option>
</select>
</td>
</tr>
</>
<tr>
<td align="right">個人愛好</td>
<td>
<input type="checkbox" name="ah" value="0"/>電腦網路
<input type="checkbox" name="ah" value="1"/>影視娛樂
<input type="checkbox" name="ah" value="2"/>棋牌游戲 <br/>
<input type="checkbox" name="ah" value="3"/>讀書讀報
<input type="checkbox" name="ah" value="4"/>美酒佳餚
<input type="checkbox" name="ah" value="5"/>繪畫書法
</td>
</tr>
<tr>
<td> </td>
<td><font face="楷體" size="3">在此選擇興趣愛好,可以選擇一個以上的選項。</td>
</tr>
<tr>
<td align="right">留言內容</td>
<td><textarea cols="25" rows="4" name="liuyan"></textarea></td>
</tr>
<tr>
<td colspan="2" bgcolor="#A3C2E4" align="center" width="100%" ><font size="2">請完成後,選擇下面的Submit按鈕提交表單。</font></td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" name="tj" value="Sumbit"/>
<input type="reset" name="qk" value="Reset"/>
</td>
</tr>
</table>
</form>
</body>
</html>
『伍』 HTML 表單提交 的簡單代碼
1、打開Dreamweaver編輯器,准備好一個空白的html文件,寫入基本的html結構:
『陸』 製作一個很簡單網頁表單代碼
<html>
<head>
<title>進入下一頁嗎</title>
<script language="JavaScript" type="text/javascript">
var http="zjc.ncu.cn/fws";//預設的網址
var url="next.html";//正確後轉到網址
function gohttp(o){
if(o.http.value==http){
document.location.reload(url);}
}
</script>
</head>
<body style=" text-align:center"><form action="" method="get">請輸入網址:<input name="http" type="text" size="40" /><br>
<input type="button" onClick="gohttp(this.form);" value="進入">
</form>
</body>
</html>
將以上內容復制到記事本後,另存為"xxx.html"
對回答的內容有問題,或認為不妥,網路消息我。
(在消息的內容里加上問題的網址哦)
『柒』 製作一個表單,求源代碼!!!
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<script>
function a(v){
if( v == "11020010710032" ){
document.getElementsByName("xuli").action="\\xueli\\1103651402008\\result.html";
}else if( v == "00000000000000" ){
document.getElementsByName("xuli").action="\\xueli\\1108073894215\\result.html";
}else if( v == "116471200306000552" ){
document.getElementsByName("xuli").action="\\xueli\\1184672192406\\result.html";
}
}
</script>
<BODY>
<table>
<form method="post" name="xuli" id="xuli" action="">
<tr>
<td width="70" height="26"><img src="/xlcx/images/200411/xlcx_zsbh.gif"></td>
<td height="26"><input name="bianhao" type="text" class="input" id="bianhao" size="36" onblur="a(this.value)" maxlength="20">
<a href="#zs"><u><font color="#FF0000">編號規則</font></u></a></td>
</tr>
<tr>
<td height="26"><img src="/xlcx/images/200411/xlcx_xm.gif" width="25" height="12"></td>
<td height="26"><input name="XM" maxlength="24" type="text" size="26" class="input"></td>
</tr>
<tr>
<td height="26"><img src="/xlcx/images/200411/xlcx_cxm.gif" width="38" height="12"></td>
<td height="26"><input name="QueryID" maxlength="15" type="text" size="26" class="input">
<input name="freeQuery" type="checkbox" value="1" style="border:#FFFFFF solid 0px;height:16px" onClick="xlcx();"><font color="#FF0000">2007</font>
<a href="javascript:cxm();"><u>獲取查詢碼</u></a></td>
</tr>
<tr>
<td height="26"><img src="/xlcx/images/200411/xlcx_yzm.gif" width="38" height="12"></td>
<td height="26"><input name="CHKNUM" type="text" id="CHKNUM" size="4" maxlength="4" class="input">
<SCRIPT>
document.write("<img border=0 align=center src=/ValidatorIMG.JPG?ID=" + Math.random()*10000 + ">")
</SCRIPT>
輸入圖片中的四個數字(<span class="STYLE1">半形輸入狀態</span>)</td>
</tr>
<tr>
<td height="30"> </td>
<td height="30" align="center" valign="bottom"><input name="chaxun" type="submit" id="chaxun" value="查 詢"></td>
</tr>
</form>
</table>
</BODY>
</HTML>
『捌』 HTML頁面怎麼獲取HTML的form表單的數據的源代碼,有嗎。。。拜託了
<form id="form1" name="form1" method="post" action="index.php
src=325&item=iframe&action=save&t=&lc=2" onsubmit="return check();" style="width:433px;height:301px">
<table width="433" height="301" cellpadding="0" cellspacing="0" style="background-image:url(images/sub_mi_expo_05.jpg); width:433px; height:301px;">
<tr>
<td height="70"></td>
</tr>
<tr>
<td width="105" align="right" height="40" class="font_color">您的姓名:</td>
<td align="left" width="102" style="width:102px; overflow:hidden;"><input type="text" id="name" name="name1" maxlength="8"/></td>
<td align="right" width="50" class="font_color" style="width:50px; overflow:hidden;">手機:</td>
<td align="left" width="176"><input type="text" id="phone" name="phone1" maxlength="11"/></td>
</tr>
<tr>
<td width="105" align="right" height="45" class="font_color">收票地址:</td>
<td colspan="3"><input type="text" id="address" name="address" maxlength="100" /></td>
</tr>
<tr>
<td width="105" align="right" height="35" class="font_color">快遞時間:</td>
<td colspan="3"><input type="radio" name="express" value="3" checked="checked"/>任何一天 <input type="radio" name="express" value="1"/>工作日 <input type="radio" name="express" value="2"/>雙休日 </td>
</tr>
<tr>
<td height="55"></td>
<td colspan="3"><p style="width:154px; text-align:center; float:left; height:37px; font-size:12px; color:#FF6666; overflow:hidden; line-height:34px; background-image:url(images/new_cdbm_12.jpg); background-repeat:no-repeat;">已有<font style="font-size:22px; color:#FF0000; font-family:Arial;"></font>人報名</p>
<p style="width:127px; height:37px;float:left;"><input type="submit" value="" id="order_sh" style=" cursor:pointer;background-image:url(images/TIJ_EXPO_NEW_06.jpg); border:0;width:127px; height:37px;" /></p></td>
</tr>
</table>
『玖』 用表格和表單製作如下網頁。完整html代碼
1、使用標簽<table></table>定義網頁的表格,使用style賦值類型將顯示在網頁。