亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

HTML input 標簽示例詳解

  發(fā)布時間:2025-06-20 16:36:40   作者:朝陽39   我要評論
input 標簽主要用于接收用戶的輸入,隨 type 屬性值的不同,變換其具體功能,本文通過實例圖文并茂的形式給大家介紹HTML input 標簽,感興趣的朋友一起看看吧

input 標簽主要用于接收用戶的輸入,隨 type 屬性值的不同,變換其具體功能。

通用屬性

屬性屬性值功能
name字符串定義輸入字段的名稱,在表單提交時,服務器通過該名稱來獲取對應的值
disabled布爾值禁用輸入框,使其無法被用戶修改和操作,也不會被提交
readonly布爾值使輸入框內(nèi)容只讀,無法編輯,但可以被選中和復制

輸入框

屬性屬性值功能
value字符串輸入框的默認值
placeholder字符串輸入框內(nèi)的提示文本,當用戶未輸入內(nèi)容時顯示,輸入內(nèi)容后消失

單行文本輸入框 text

<input type="text" name="username" placeholder="請輸入用戶名" />
屬性屬性值功能
maxlength數(shù)字可輸入的最大字符數(shù)

密碼輸入框 password

<input type="password" name="password" placeholder="請輸入密碼" />

數(shù)字輸入框 number

可通過上下箭頭調(diào)整數(shù)值

在這里插入圖片描述

<input type="number" name="age" min="0" max="200" />
屬性屬性值功能
min數(shù)字最小值
max數(shù)字最大值
step數(shù)字輸入值的增量或減量
  • step="2" 表示輸入值的增量或減量為 2,min="0"表示最小值為 0。用戶只能輸入 0、2、4、6 等符合步長規(guī)則的值。

電子郵件輸入框 email

<input type="email" name="email" placeholder="請輸入郵箱地址" />

網(wǎng)址輸入框 url

<input type="url" name="website" placeholder="請輸入網(wǎng)址">

搜索輸入框 search

用于搜索的文本字段,一些瀏覽器會顯示搜索圖標等樣式

<input type="search" name="search" placeholder="請輸入搜索內(nèi)容" />

按鈕 submit reset button image

    <input type="submit" value="提交" />
    <input type="reset" value="重置" />
    <!-- 普通按鈕 -->
    <input type="button" value="按鈕" />
    <!-- 使用圖像作為提交按鈕 -->
    <input type="image" src="submit-button.png" alt="Submit Form" />
  • 提交按鈕,用于將表單數(shù)據(jù)發(fā)送到服務器進行處理
  • 重置按鈕,點擊可將表單字段重置為初始值
  • 普通按鈕,通常與 JavaScript 一起使用來觸發(fā)腳本或執(zhí)行特定操作
屬性屬性值功能
formaction字符串用于覆蓋 <form> 元素本身的 action 屬性,允許在同一個表單中為不同的提交按鈕指定不同的目標 URL,使表單數(shù)據(jù)可以根據(jù)不同的操作需求提交到不同的處理頁面。
<input type="submit" formaction="URL1">
<input type="image" formaction="URL2">
<button type="submit" formaction="URL3">提交</button>

用戶點擊 <input type="image"> 按鈕時,除了表單中的其他數(shù)據(jù),瀏覽器還會自動提交兩個額外的參數(shù):x 和 y,它們分別表示用戶點擊圖像的水平和垂直坐標。在服務器端腳本中可以獲取這些坐標值。

單選 radio

    <input type="radio" name="sex" value="男" checked />男
    <input type="radio" name="sex" value="女" />女
屬性屬性值功能
checked布爾值設置默認選中狀態(tài)

多選 checkbox

    <input type="checkbox" name="hobby" value="籃球" />籃球
    <input checked type="checkbox" name="hobby" value="閱讀" />閱讀
    <input checked type="checkbox" name="hobby" value="編程" />編程
屬性屬性值功能
checked布爾值設置默認選中狀態(tài)

文件上傳 file

<input type="file" />

滑塊 range

<input type="range" name="range" min="0" max="100" step="1" />
屬性屬性值功能
step數(shù)字滑塊移動的間隔
min數(shù)字最小值
max數(shù)字最大值
  • step="5" 意味著滑塊每次移動的距離是 5 個單位,用戶可以選擇的值為 0、5、10 等

顏色選擇器 color

用戶可以選擇顏色

<input type="color" name="color" />

日期選擇器 date

<input type="date" name="birthdate" />

  • step="7" 表示日期選擇的間隔為 7 天,用戶只能選擇每周的同一天。

時間選擇器 time

<input type="time" name="startTime" />

到此這篇關于HTML input 標簽的文章就介紹到這了,更多相關html input 標簽內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章,希望大家以后多多支持腳本之家!

相關文章

最新評論