10. 表單註冊
阿新 • • 發佈:2022-03-08
10. 表單的註冊
<body> <!--表單form <form></>form>需要寫在form標籤之內 <form action="1.我的第一個網頁.html" method="get"> action:表單提交的位置,可以是網站,也可以是一個請求處理地址 method: get/post 提交方式 get方式提交:我們可以在url中看到我們提交的資訊, 所以不安全 但是高效 post方式提交: 看不到提交的資訊 , 所以安全 另外還可以傳輸大檔案 --> <form action="1.我的第一個網頁.html" method="get"> <!----> <!-- input 輸入框 文字輸入框 <input type="text" name="username"> value="預設初始值為intelliyu" 預設初始值 maxlength="5" 能輸入的最多幾個字元 size="15" 文字框的長度 --> <p>名字: <input type="text" name="username" value="預設初始值為intelliyu" maxlength="5" size="15"></p> <!-- 密碼輸入框 <input type="password" name="pwd"> --> <p>密碼:<input type="password" name="pwd"></p> </form> <!--單選框標籤: <input type="radio" value="boy" name="sex" checked/> value:單選框的值 name:表示組 checked 表示預設選中 --> <form> <p>性別: <input type="radio" value="boy" name="sex"/>男 <input type="radio" value="girl" name="sex" checked/>女 </p> </form> <!-- 多選框標籤: <input type="checkbox" value="code" name="hobby" checked> checked 表示預設選中 --> <form> <p>愛好: <input type="checkbox" value="code" name="hobby" checked>敲程式碼 <input type="checkbox" value="playgame" name="hobby">打電動 <input type="checkbox" value="sleep" name="hobby">睡覺 </p> </form> <!--按鈕標籤 普通按鈕: <input type="button" name="btn1" value="按鈕上面的字">按鈕1 value : 表示按鈕上面的字 圖片按鈕: <input type="image" src="../resources/image/1.jpg" > src 表示圖片路徑 歸納: input type="button" 普通按鈕 input type="image" 圖片按鈕 input type="submit" 提交按鈕 input type="reset" 重置按鈕 --> <form> <p>按鈕: <input type="button" name="btn1" value="按鈕上面的字">按鈕1 <input type="image" src="../resources/image/1.jpg" >按鈕2 </p> <p> <input type="submit">提交的 <input type="reset" value="清空表單">重置的 </p> </form> <!--下拉框 列表框 <select name="列表名稱"> <option value="選項的值" selected>日本</option> <option value="China">中國</option> </select> selected表示預設選中的框 --> <form> <p>下拉框: <select name="列表名稱"> <option value="China" selected>中國</option> <option value="usa">美國</option> <option value="選項的值" selected>日本</option> <option value="選項的值">義大利</option> </select> </p> </form> <!-- 文字域: <textarea name="textarea" cols="10" rows="30">文字內容</textarea> cols 表示列 rows 表示行 --> <!-- 檔案域 <input type="file" name="files"> name的值可以隨便自己定義 而且name值得寫,不寫上傳之後在位址列中看不到 因為是用name的值=""來顯示的 --> <form> <p>文字域:反饋: <textarea name="textarea" cols="50" rows="10">文字內容</textarea> </p> <p>檔案域: <input type="file" name="files"> <input type="button" value="按鈕上面的字" name="upload"> </p> </form> <!--一些擴充 <p>郵件驗證 <input type="email" name="emails"> </p> <p>url驗證 <input type="url" name="url"> </p> <p>數字驗證 <input type="number" name="number" max="100" min="0" step="5"> </p> <p>滑塊(比如音量) <input type="range" name="voice" max="100" min="0"> </p> <p>搜尋框 <input type="search" name="search"> </p> --> <form> <p>郵件驗證 <input type="email" name="emails"> </p> <p>url驗證 <input type="url" name="url"> </p> <p>數字驗證 <input type="number" name="number" max="100" min="0" step="5"> </p> <p>滑塊(比如音量) <input type="range" name="voice" max="100" min="0"> </p> <p>搜尋框 <input type="search" name="search"> </p> </form> <!--寫在form外面沒反應--> <p> <input type="submit">提交的 <input type="reset" value="清空表單">重置的 </p> <h3>input標籤都需要name值</h3> </body>