1. 程式人生 > >python學習第二十七天(HTML之表單標籤)

python學習第二十七天(HTML之表單標籤)

  • form表單標籤
    表單用於向伺服器傳輸資料。
    表單能夠包含 input 元素,比如文字欄位、複選框、單選框、提交按鈕等等。
    表單還可以包含textarea、select、fieldset和 label 元素。

  • 表單屬性
    HTML 表單用於接收不同型別的使用者輸入,使用者提交表單時向伺服器傳輸資料,從而實現使用者與Web伺服器的互動。表單標籤, 要提交的所有內容都應該在該標籤中.
    1、action: 表單提交到哪. 一般指向伺服器端一個程式,程式接收到表單提交過來的資料(即表單元素值)作相應處理,比如https://www.sogou.com/web
    2、method: 表單的提交方式 post/get, 預設取值就是get。

       get: 1.提交的鍵值對.放在位址列中url後面. 2.安全性相對較差. 3.對提交內容的長度有限制.
       post:1.提交的鍵值對 不在位址列. 2.安全性相對較高. 3.對提交內容的長度理論上無限制.
       get/post是常見的兩種請求方式.
    
  • 表單元素
    <input> 標籤的屬性和對應值。

type:        text 文字輸入框

             password 密碼輸入框

             radio 單選框

             checkbox 多選框  

             submit 提交按鈕            

             button 按鈕(需要配合js使用.) button和submit的區別?

             file 提交檔案:form表單需要加上屬性enctype="multipart/form-data"   

name:    表單提交項的鍵,表單提交是以鍵值對的形式提交的。注意和id屬性的區別:name屬性是和伺服器通訊時使用的名稱;而id屬性是瀏覽器端使用的名稱,該屬性主要是為了方便客戶端程式設計,而在css和javascript中使用的。
value:   表單提交項的值.對於不同的輸入型別,value 屬性的用法也不同。在text和password型別中表示預設值。

checked:  用於radio 和 checkbox 型別,表示預設被選中。

readonly: 只讀. 用於text 和 password 型別。

disabled: 對所有的型別都有用.表示禁用。

例:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<form action="http://127.0.0.1:8080">
    <h1>註冊頁面</h1>
    <p>使用者名稱:<input type="text" name="username"></p>
    <p>密碼:<input type="password" name="password"></p>
    <p>愛好 <input type="checkbox" name="hobby" value="sing">唱歌 <input type="checkbox" name="hobby" value="dance">跳舞</p>
    <p>性別 <input type="radio" name="1" value="man">男 <input type="radio" name="1" value="waman">女</p>

    <input type="submit" value="提交註冊">
</form>
</body>
</html>

在這裡插入圖片描述
<select> 下拉選標籤屬性

name:表單提交項的鍵.

size:選項個數

multiple:multiple  多選

<option>在select的標籤體中使用,表示下拉選中的每一項。他的屬有value:表單提交項的值.   selected: selected下拉選預設被選中