關於編輯器對<input>標簽報錯提示“表單輸入沒有相關lable”的問題

来源:https://www.cnblogs.com/ztsuper/archive/2018/01/17/8303599.html
-Advertisement-
Play Games

相信很多朋友在製作表單的時候,我們的編輯器會有下圖的相關提示吧 我們發現雖然這樣並不影響我們的正常使用,但是看著這樣的報錯提示總是很讓人心煩,那麼這到底是為什麼呢? 其實,這是因為編輯器建議我們在使用<input>標簽時,用相應的<lable>標簽對其進行標記。不想百度的同學可以繼續往下看嘍: <l ...


  相信很多朋友在製作表單的時候,我們的編輯器會有下圖的相關提示吧

  我們發現雖然這樣並不影響我們的正常使用,但是看著這樣的報錯提示總是很讓人心煩,那麼這到底是為什麼呢?

  其實,這是因為編輯器建議我們在使用<input>標簽時,用相應的<label>標簽對其進行標記。不想百度的同學可以繼續往下看嘍:

  <label>標簽其實是為了方便滑鼠用戶選擇的標簽,,如圖,當我們在選擇男女時,通常會點擊裡面的圓圈,但是如果遇到這樣的情況呢,想必點圓圈大家就會覺得很麻煩了吧?這時候就該<label>出場了,代碼如下:

 <input type="radio" name="consider" id="1" value="henhao" checked/>
<label for="1">我認為這樣很好</label>
<input type="radio" name="consider" id="2" value="butaihao"/>
<label for="2">我認為這樣不太好</label>

這樣,當我們點擊圓圈旁邊的字的時候,也就會發生和點擊圓圈一樣的效果。會不會覺得這樣很麻煩?嘿嘿,<label>標簽還有一個小技巧,你可以把代碼寫成這樣

<label>
    <input type="radio" name="consider" value="henhao" checked/>我認為這樣很好
</label>
<label>
    <input type="radio" name="consider" value="butaihao"/>我認為這樣不太好
</label>

成了,只要用<label></label>標簽把<input>標簽包涵進去就可以了

 


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

-Advertisement-
Play Games
更多相關文章
  • 小程式的二維碼,是靜態的,在公眾號里傳播的時候,效果不太好,但是因為小程式的logo 很大,可以容納很多的內容,所以就希望中間的部分可以動態顯示。 經過我們的驗證,是可行的,來幾張效果圖 1. 二次元小程式碼,將一些搞小的gif動畫放在小程式碼里,非常適合在二次元的世界里傳播 2. 游戲小程式碼 , ...
  • 1.首先進入蘋果官網 找到support https://support.apple.com 2.找到查詢ipad型號的地方 點擊Check coverage for your product 3.輸入你的ipad序列號,序列號在ipad上 通用 >關於本機 >序列號 ...
  • 一,Jenkins http://jenkins-ci.org 二,iOS單元測試的持續集成 在Xcode進入OCUnit作為單元測試框架前,把單元測試分為兩種:Logic Test和Application Test.Logic Test負責測試邏輯部分,一般邏輯部分是沒有UI的。 Applicat ...
  • 字元串方法字元串切割slicestrObj.slice(start[,end])參數為負,將它作為length+end處理,此處length為字元串的長度。 str.slice( 2)可以取字元串後兩位substringstrObj.substring(start[,end])  ...
  • 文章系國內領先的 ITOM 管理平臺供應商 OneAPM 編譯呈現。 您是網站管理員還是網頁開發人員?想創建超快速的網站嗎? 今天我們來看看 JavaScript,這項神奇而又複雜的技術。它使網站內容更加豐富,但常常出現的運行性能問題又降低了用戶的體驗。事實已經證明,最佳的終端用戶體驗能提升網站的轉 ...
  • 我們在上一篇文章中講到了JS中變數的概念,本篇文章講一下運算符和表達式。 ...
  • 1、children與childNodes children: 獲取子元素節點,無相容問題 childnNodes: IE:獲取子元素節點 非IE(chrome,Firefox等):獲取子節點,包括元素節點和文本節點 2、firstChild與firstElementChild firstChild ...
  • 1、absolute和float 擁有相同的特性表現: ①包裹性(容器應用之後,可以包裹裡面的內容); ②破壞性(內容應用之後,會破壞父容器) 2、absolute和relative absolute和relative是分離的,對立的。父容器是relative,子元素是absolute,可以限制子元 ...
一周排行
    -Advertisement-
    Play Games
  • .Net8.0 Blazor Hybird 桌面端 (WPF/Winform) 實測可以完整運行在 win7sp1/win10/win11. 如果用其他工具打包,還可以運行在mac/linux下, 傳送門BlazorHybrid 發佈為無依賴包方式 安裝 WebView2Runtime 1.57 M ...
  • 目錄前言PostgreSql安裝測試額外Nuget安裝Person.cs模擬運行Navicate連postgresql解決方案Garnet為什麼要選擇Garnet而不是RedisRedis不再開源Windows版的Redis是由微軟維護的Windows Redis版本老舊,後續可能不再更新Garne ...
  • C#TMS系統代碼-聯表報表學習 領導被裁了之後很快就有人上任了,幾乎是無縫銜接,很難讓我不想到這早就決定好了。我的職責沒有任何變化。感受下來這個系統封裝程度很高,我只要會調用方法就行。這個系統交付之後不會有太多問題,更多應該是做小需求,有大的開發任務應該也是第二期的事,嗯?怎麼感覺我變成運維了?而 ...
  • 我在隨筆《EAV模型(實體-屬性-值)的設計和低代碼的處理方案(1)》中介紹了一些基本的EAV模型設計知識和基於Winform場景下低代碼(或者說無代碼)的一些實現思路,在本篇隨筆中,我們來分析一下這種針對通用業務,且只需定義就能構建業務模塊存儲和界面的解決方案,其中的數據查詢處理的操作。 ...
  • 對某個遠程伺服器啟用和設置NTP服務(Windows系統) 打開註冊表 HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Services\W32Time\TimeProviders\NtpServer 將 Enabled 的值設置為 1,這將啟用NTP伺服器功 ...
  • title: Django信號與擴展:深入理解與實踐 date: 2024/5/15 22:40:52 updated: 2024/5/15 22:40:52 categories: 後端開發 tags: Django 信號 松耦合 觀察者 擴展 安全 性能 第一部分:Django信號基礎 Djan ...
  • 使用xadmin2遇到的問題&解決 環境配置: 使用的模塊版本: 關聯的包 Django 3.2.15 mysqlclient 2.2.4 xadmin 2.0.1 django-crispy-forms >= 1.6.0 django-import-export >= 0.5.1 django-r ...
  • 今天我打算整點兒不一樣的內容,通過之前學習的TransformerMap和LazyMap鏈,想搞點不一樣的,所以我關註了另外一條鏈DefaultedMap鏈,主要調用鏈為: 調用鏈詳細描述: ObjectInputStream.readObject() DefaultedMap.readObject ...
  • 後端應用級開發者該如何擁抱 AI GC?就是在這樣的一個大的浪潮下,我們的傳統的應用級開發者。我們該如何選擇職業或者是如何去快速轉型,跟上這樣的一個行業的一個浪潮? 0 AI金字塔模型 越往上它的整個難度就是職業機會也好,或者說是整個的這個運作也好,它的難度會越大,然後越往下機會就會越多,所以這是一 ...
  • @Autowired是Spring框架提供的註解,@Resource是Java EE 5規範提供的註解。 @Autowired預設按照類型自動裝配,而@Resource預設按照名稱自動裝配。 @Autowired支持@Qualifier註解來指定裝配哪一個具有相同類型的bean,而@Resourc... ...