Bootstrap框架的表單控件的禁用狀態和普通的表單禁用狀態實現方法是一樣的，在相應的表單控件上添加屬性“disabled”。和其他表單的禁用狀態不同的是，Bootstrap框架做了一些樣式風格的處理：
/*源碼請查看bootstrap.css文件第1723行～第1729行*/
.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
cursor: not-allowed;
background-color: #eee;
opacity: 1;
}
使用方法為：只需要在需要禁用的表單控件上加上“disabled”即可：
<input class="form-control" type="text" placeholder="表單已禁用，不能輸入" disabled>
運行效果如下或查看右側結果窗口：
在使用了“form-control”的表單控件中，樣式設置了禁用表單背景色為灰色，而且手型變成了不準輸入的形狀。如果控件中不使用類名“form-control”，禁用的控件只會有一個不準輸入的手型出來。
/*源碼請查閱bootstrap.css文件第1781行～第1794行*/
input[type="radio"][disabled],
input[type="checkbox"][disabled],
.radio[disabled],
.radio-inline[disabled],
.checkbox[disabled],
.checkbox-inline[disabled],
fieldset[disabled] input[type="radio"],
fieldset[disabled] input[type="checkbox"],
fieldset[disabled] .radio,
fieldset[disabled] .radio-inline,
fieldset[disabled] .checkbox,
fieldset[disabled] .checkbox-inline {
cursor: not-allowed;
}
在Bootstrap框架中，如果fieldset設置了disabled屬性，整個域都將處于被禁用狀態。
<form role="form">
<fieldset disabled>
<div class="form-group">
<label for="disabledTextInput">禁用的輸入框</label>
<input type="text" id="disabledTextInput" class="form-control" placeholder="禁止輸入">
</div>
<div class="form-group">
<label for="disabledSelect">禁用的下拉框</label>
<select id="disabledSelect" class="form-control">
<option>不可選擇</option>
</select>
</div>
<div class="checkbox">
<label>
<input type="checkbox">無法選擇
</label>
</div>
<button type="submit" class="btnbtn-primary">提交</button>
</fieldset>
</form>
運行效果如下或查看右側結果窗口：
據說對于整個禁用的域中，如果legend中有輸入框的話，這個輸入框是無法被禁用的。我們一起來驗證一下：
<form role="form">
<fieldset disabled>
<legend><input type="text" class="form-control" placeholder="顯然我顏色變灰了，但是我沒被禁用，不信？單擊試一下" /></legend>
…
</fieldset>
</form>
運行效果如下或查看右側結果窗口：
本小節沒有代碼任務，單擊“提交”按鈕進行下一個小節學習。
請驗證，完成請求
由于請求次數過多，請先驗證，完成再次請求
打開微信掃碼自動綁定
綁定后可得到
使用 Ctrl+D 可將課程添加到書簽
舉報