表單元素

来源:http://www.cnblogs.com/jgbk/archive/2017/10/25/7732229.html
-Advertisement-
Play Games

一、form form代表表單,功能:用於申明表單,定義採集數據的範圍,也就是<form>和</form>裡面包含的數據將被提交到伺服器或者電子郵件里。<form> 標簽用於為用戶輸入創建 HTML 表單。表單能夠包含input元素,比如文本欄位、覆選框、單選框、提交按鈕等等。表單還可以包含text ...


一、form

      form代表表單,功能:用於申明表單,定義採集數據的範圍,也就是<form>和</form>裡面包含的數據將被提交到伺服器或者電子郵件里。<form> 標簽用於為用戶輸入創建 HTML 表單。表單能夠包含input元素,比如文本欄位、覆選框、單選框、提交按鈕等等。表單還可以包含textarea、type、name、value等元素。表單用於向伺服器傳輸數據。

1.action

    action 屬性規定當提交表單時,向何處發送表單數據,把數據提交給哪個網站。

2.method

    method表示數據提交方式,提交方式有兩種:

        get—顯式提交,有長度限制。

        post—隱式提交

3.target

    target表示提交方式,提交方式主要有以下幾項。

        _blank:在新視窗中打開。                            _parent:在父框架集中打開。

        _self:預設。在相同的框架中打開。                 _top:在指定的框架中打開。

二、文本

1.文本框<input type="text" />,其屬性有:

        value文本框的值,就是文本框裡面顯示的內容。

        name文本框的名稱

2.密碼框<input type="password" />,雖然密碼框和文本框相似,但在密碼框裡面輸入內容時不顯示內容,只顯示●。

3.隱藏域<input type="hidden />,隱藏域的屬性有:

        name密碼框的名稱

        value密碼框的值

4.文本域<input /><textarea></textera>,雙標簽元素,值不是寫在value屬性裡面的,是寫在開始結束標簽之間的,現在所學內容還不能夠調整文本域的大小。示例代碼:<input /><textarea>無言</textarea>,文本域裡面就會顯示“無言”。

三、按鈕

1.普通按鈕<input type="button" />,只顯示一個按鈕,但是點上去沒有反應。

2.提交按鈕<input type="submit" />,具有提交功能。按鈕上顯示“提交”,提交按鈕的屬性有:

        name:按鈕的名字

        value:按鈕上顯示的名字。<input type="submit" value="按鈕" />,按鈕上就會顯示“按鈕”兩個字,替換了預設的“提交”。

3.重置按鈕<input type="reset" />,作用是將表單里的內容重置。

<form target="_blank" action="Untitled-3.html" method="post">
    <input type="text" />
    <input type="submit" />
    <input type="reset" name="" value="重置" />
</form>

4.圖片按鈕<input type="image" />提交數據,其屬性有:

        name:按鈕的名字。

        src:圖片按鈕的圖片來源地址。

四、選擇

1.單選按鈕<input type="radio" />,單選按鈕的屬性有:

        name:按鈕名稱和組名

        value:按鈕的值 

<input type="radio" name="sex" value="" /><input type="radio" name="sex" value="" />女

上面2行代碼表示單選(選男或女),input type="radio"表示此代碼為單選按鈕,name="sex"表示此2行代碼為一組。男、女為選項,只能選一個選項。

2.覆選框<input type="checkbox" />,覆選框的屬性有:

        name:覆選框的名稱

        value:覆選框的值

<input type="checkbox" name="" value="" />A
<input type="checkbox" name="" value="" />B
<input type="checkbox" name="" value="" />C
<input type="checkbox" name="" value="" />D

上面4行代碼表示覆選(多選),<input type="checkbox" />表示此組代碼為覆選代碼,A、B、C、D表示4個選項,可以選1-4個選項。

3.下拉列表<select></select>雙標簽,下拉列表屬性有:

        name--下拉列表名稱

        <option></option>:代表項,就是下拉列表裡的選項。

<select>
    <option>張店</option>
    <option>淄川</option>
    <option>恆台</option>
    <option>周村</option>
</select>

上面代碼內容表示下拉列表裡面有張店、淄川、恆台、周村四個選項。

    value:該項的值。

4.文件選擇<input type="file" name="" value="" />,文件選擇的屬性有:

    name--文件選擇的名稱

5.其它屬性

 ①readonly 只讀

 ②disabled  不可用,同時不能提交

 ③hidden  隱藏

 ④checked     radio  checkbox 用來做選中

 ⑤selected    用在下拉列表,設置哪一項選中


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 一、介紹 沒錯,這是第五篇,到了引用類型,這次要分成兩次博文了,太多內容了,這是前篇,篇幅很長也很多代碼,主要講引用類型和常用的引用類型,代碼試驗過的,老鐵沒毛病。 堅持看堅持寫,不容易不容易,希望大家能在這博客中學到東西。能和大家分享,不錯不錯。而且啊,我想通過自己的認識,思考來得到一些個人見解, ...
  • 語法結構 try catch finally是ECMAScript-262 第三版提供異常處理機制的標準,語法結構如下: 語法與大多數語言一樣 如java .net,如果try{}代碼塊捕獲到了異常,那麼catch塊會得到一個錯誤信息對象(Error 的實例)。 我們應該把有可能發生錯誤的代碼放在t ...
  • url: 要求為String類型的參數,(預設為當前頁地址)發送請求的地址。 type: 要求為String類型的參數,請求方式(post或get)預設為get。註意其他http請求方法,例如put和 delete也可以使用,但僅部分瀏覽器支持。 timeout: 要求為Number類型的參數,設置 ...
  • 《大學》原文:大學之道,在明明德,在親民,在止於至善。知止而後有定,定而後能靜,靜而後能安,安而後能慮,慮而後能得。物有本末,事有終始,知所先後,則近道矣。 【譯文】大學的宗旨在於弘揚光明正大的品德,在於使人棄舊圖新,在於使人達到最完善的境界。知道應達到的境界才能夠志向堅定;志向堅定才能夠鎮靜不躁; ...
  • 在寫頁面的時候有時會遇到這樣的需求,需要兩個頁面之間傳遞數據或者一個事件。這個時候,就需要用到我今天所要講的storage事件,學習這個事件之前,需要先瞭解localStorage的用法。具體用法可以查看其他文檔。出發storage事件的條件如下: storage事件,只有在同源頁面下,才有作用,不 ...
  • 吃過晚飯,再練一題 第五題 分析: 技術點:正則表達式,html鏈接,img標簽使用 正則表達式: 第2行:替換s中所有的<和",用html編碼表示,點擊查看 HTML編碼表 正則表達式 g 代表全局模式,javascript replace 用法如下 第4行:將http://xx形式的內容替換成< ...
  • 小註:display屬性在網頁佈局中非常常見,但經常用到的僅僅是block、inline-block、inline和none等寥寥幾個屬性值,下麵本人將詳細介紹display屬性的各個方面 定義 display屬性用於規定元素生成的框類型,影響顯示方式 常用值: none | inline | bl ...
  • **CSS語法** CSS 規則由兩個主要的部分構成:選擇器,以及一條或多條聲明。選擇器通常是您需要改變樣式的 HTML 元素。```selector {declaration1; declaration2; ... declarationN }```每條聲明由一個屬性和一個值組成。屬性(prope ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...