HTML input submit 按鈕

admin發表於2018-02-13
HTMLMIT

將<input>標籤的type屬性值設定為"submit"即可建立一個提交按鈕。

點選提交按鈕，表單會有提交動作，下面結合程式碼例項進行一下介紹。

首先看一段簡單程式碼：

[HTML] 純文字檢視 複製程式碼執行程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title> 
</head>
<body>
<form name="myform" method="post" action="do.php">
  賬號：<input type="text"/><br/>
  密碼：<input type="text"/><br/>
        <input type="submit" value="提交"/>
        <input type="reset" value="重置"/>
    </form>
</body>
</html>

點選提交按鈕，會將表單元素的值提交到do.php。

提交按鈕具有的主要屬性如下：

（1）.autofocus（HTML5）：規定在頁面載入時，按鈕自動地獲得焦點。

（2）.disabled：設定按鈕為不可用。

（3）.value：設定按鈕的顯示文字內容，在表單中，資料也會被提交。

[HTML] 純文字檢視 複製程式碼執行程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title> 
</head>
<body>
<form name="myform" method="post" action="do.php">
  賬號：<input type="text"/><br/>
  密碼：<input type="text"/><br/>
        <input type="submit" value="提交" autofocus/>
        <input type="reset" value="重置"/>
    </form>
</body>
</html>

為按鈕設定autofocus屬性，程式碼執行效果截圖如下：

a:3:{s:3:\"pic\";s:43:\"portal/201910/03/203511r16be0a22wwh1iie.jpg\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

頁面載入後，將會自動獲取焦點，非常容易理解。

給按鈕設定disabled屬性後，此按鈕將處於不可用狀態，它的value值也不會被提交。

相關文章