標籤for屬性與對應的id之關係

來源:互聯網
上載者:User

Dreamweaver8 標籤for屬性與對應的id之關係

<label>標籤的功能是使瀏覽器用焦點矩形呈現在與表單對象關聯的文本,使得使用者可通過關聯文本的任意位置,而不僅是在表單對象上,單擊來選擇該表單。

在DW8中插入表單元素,會彈出【輸入標籤協助工具功能屬性】對話方塊,使用”for”屬性附加標籤標記時,會在插入的表單項的兩側邊(前側或後側)添加一個標籤標記“<label>…</label>”

比如,在下面例子中直接單擊文本“使用者名稱”就可同樣選中表單元素。

運行代碼框
<form><label for="cn_bruce">使用者名稱</label><input type="text" name="cn_bruce" accesskey="c" id="cn_bruce" /></form>
[Ctrl+A 全部選擇 提示:你可先修改部分代碼,再按運行]

主要就是 label 屬性 for="cn_bruce" 而 input 屬性 id="cn_bruce",此為關聯。

但使用DW8進行插入時,預設的 input 的 name 和 id 屬性是相同的“textfield n(n=Φ,1,2,……)”

但很顯然,在插入完表單對象後,需要重新編輯表單項的“名稱”,比如修改“textfield”為“cn_bruce”

則,表單項的name 和 id 一起修改為“cn_bruce”

然而預設的標籤label的 for 屬性值還是 “textfield”,如果要實現 label 的功能就必須手動修改 for 的值

不過,相同的設定在對 radio 單選框進行設定時,卻是能保證 label 的 for 屬性值一直與對應的 表單項的 id值吻合

主要原因就是,當對radio 進行 name 屬性值修改時,其對於的id 值是不變的。

為什麼不變?

首先,radio 也就是單選框的功能是 多個當中選擇一個,那麼怎麼區別許多的 radio 是一個組裡面的,就從這一組中選擇某一個。那麼HTML標籤就是要求,這許多的選項按鈕要想是一個組裡面的,必須要求其 name 屬性值一樣,比如下面的三個radio的name值都為“s”,則是一個組的。

運行代碼框
男 <input type="radio" name="s" value="n" />女 <input type="radio" name="s" value="v" />妖 <input type="radio" name="s" value="y" />
[Ctrl+A 全部選擇 提示:你可先修改部分代碼,再按運行]

那麼只要一個name不同,則不屬於一個組

OK,一直說明的是 radio 要求 name 值一樣,再切到話題

因為上面其他的表單項在改變name屬性值時自動改變id值

那麼,如果radio也是改變name屬性值時自動改變id值,因為radio的name值的一樣,所以勢必使得id值也一樣

但,id屬性值能一樣嗎?id就是網頁文檔中網頁元素對象的社會安全號碼,是不建議相同的,所以,radio 的 id值就保持不變

所以,radio 對應的 label 標籤的 for屬性值 也就與之吻合

故,在Dreamweaver8中建立表單項時,其<label>標籤的for屬性值不能始終對應其表單項的ID值,為後來的編輯帶來些麻煩。

所以,在DW8 中操作label和表單項:

要不就是使得 <label>標籤的for屬性值隨著表單項id 值的變化而變化

要不就是在修改表單項name屬性的同時,保持id屬性值不變(如radio)



相關文章

Beyond APAC's No.1 Cloud

19.6% IaaS Market Share in Asia Pacific - Gartner IT Service report, 2018

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。