web前端中表單有什麼作用

表單的作用有兩個：1、對使用者而言是資料輸入和提交的介面；2、對網站而言是取得使用者資訊的途徑。一個表單有三個基本組成部分：1、表單標籤，包含了處理表單資料所用CGI程式的URL以及資料提交到伺服器的方法；2、表單網域，包含了文字方塊、密碼框、隱藏域、多行文本框等；3、表單按鈕，包含了提交按鈕、重設按鈕和一般按鈕，用於將資料傳送到伺服器上的CGI腳本或取消輸入等。

本教學操作環境：windows7系統、Dell G3電腦。

web前端中的表單

表單，在網頁中的作用不可小視，主要負責資料收集的功能，例如你可以擷取訪客的名字和e－mail地址、調查表、留言簿等等。

表單的作用：

• 表單對使用者而言是資料輸入和提交的介面；

• 表單對於網站而言是取得使用者資訊的途徑。

一個表單有三個基本組成： 

• #表單標籤<form></form> ：這裡麵包含了處理表單資料所用CGI程式的URL以及資料提交到伺服器的方法。 

• 表單網域：包含了文字方塊、密碼方塊、隱藏網域、多行文字方塊、核取方塊、單一選取方塊、下拉選取方塊和檔案上傳方塊等。

• 表單按鈕：包含提交按鈕、重設按鈕和一般按鈕；用於將資料傳送到伺服器上的CGI腳本或取消輸入，也可以用表單按鈕來控制其他定義了處理腳本的處理工作。

表單標籤<form></form>

#form標籤用於建立使用者輸入的HTML表單（表單域），以實現使用者資訊的收集和傳遞，form中的所有內容都會提交給伺服器。

form表單域中可以包含各種互動控制項--控制項標籤（文字欄位、複選框、單選框、提交按鈕等等），例如、、< ; select>、等標籤。

標籤語法格式

<form action="提交地址" method="提交方式" name="表单名称">
    各种表单控件
</form>

method提交方式常用的4種：

get         一般用来查询信息
post        一般用来新增信息
put         一般用来修改信息
delete      一般用来删除信息

表單域和表單按鈕

input標籤

• input 輸入的意思
• <input /> 標籤為單一標籤
• type屬性設定不同的屬性值用來指定不同的控制項類型
• #除了type屬性還有別的屬性

#type="text"為普通輸入框value為裡面的值name和id會在寫js的時候用##

    <form action="url地址" method="提交方式" name="表单名称">
        <input type="text" name="" id="" value="你好">
    </form>

input標籤的一些屬性:

checked屬性只有單選方塊和複選框才有

屬性屬性值#描述type# Text單行文字輸入框#Password「密碼輸入方塊##重設按鈕Image圖片形式的提交按鈕##File namevaluesizecheckedMaxlength

Password
	Radio	單選按鈕
	Checkbox	複選框
	Button	#普通按鈕
	Submit	提交按鈕
	#Reset
	文字域
	#空間的名稱
	input控制項中的預設文字值
	##input控制項在頁面中的顯示寬度
	#定義選擇空間預設被選取的項目

######控制項允許輸入的最多字元數############

密码框

<input type="password" name="" id="" value="">

单选框

name相同的单选框智能选择一个

        男 <input type="radio" name="gender" id="" value=""> 
        女 <input type="radio" name="gender" id="" value="">

复选框

多选框可以选取多个

        爱好： <br> 
        抽烟<input type="checkbox" name="hobby" id="" value=""> 
        喝酒<input type="checkbox" name="hobby" id="" value=""> 
        烫头<input type="checkbox" name="hobby" id="" value="">

按钮

普通按钮可以根据需求来用js添加功能

提交按钮会把输入的表单信息提交到form表单的action地址

重置按钮会把表单信息重置为默认

    <form action="url地址" method="提交方式" name="表单名称">
        <input type="button" name="" id="" value="我是一个普通按钮">
        <input type="submit" name="" id="" value="我是一个提交按钮">
        <input type="reset" name="" id="" value="我是一个重置按钮">
    </form>

下拉框标签

下拉框标签有点特殊，不是input的属性而是一个单独的标签

        <select name="省市区" id="">
            <option value="">山东</option>
            <option value="">北京</option>
            <option value="">江苏</option>
            <option value="">深圳</option>
            <option value="">上海</option>
        </select>

相关推荐：《html视频教程》

以上是web前端中表單有什麼作用的詳細內容。更多資訊請關注PHP中文網其他相關文章！