HTML button disabled 停用按鈕

HTML button disabled 停用按鈕是 HTML button 的一個預設功能,通常用來設計一個僅供視覺效果的按鈕,例如不讓網友送出的表單,別以為不會有這種情況,其實應用的機會很多,再舉個例子,如果有一份表單,其中有幾個欄位或是所有欄位都必須填寫完成,才能夠送出表單,這種情況就可以用 JavaScript 檢查表單後,如果該填寫的欄位都有填寫,確定可以送出表單,就把停用按鈕的 disabled 取消,讓按鈕變成可以送出表單,應用方式相當的多樣,這裡我們先來看看這個 HTML button disabled 停用按鈕要怎麼寫。

HTML button disabled 停用按鈕範例
檔案: 在新視窗開啟程式碼文字檔
範例的實際效果
從範例的實際效果可以看到兩個被停用的按鈕,HTML button 的 disabled 效果有兩種寫法,分別是「disabled="disabled"」以及「disabled="true"」這兩種,有什麼差別呢?其實效果是一樣的,只是 HTML 本身語法不是太嚴謹,另一方面也是讓設計師可以比較容易使用,這兩種寫法都可以讓按鈕停用,至於要怎麼運用就看各位設計師的巧思囉!

補充:disabled 也可以套用在送出表單的按鈕(submit)會有同樣的效果。

更多網頁按鈕設計
分享於 2015-03-01