layui表單的下拉選擇框select禁止點擊/禁用/不可操作的實現方法 ...
layui表單的下拉選擇框select禁止點擊/禁用/不可操作的實現方法
直接上代碼:
<form class="layui-form"> <!-- 提示:如果你不想用form,你可以換成div等任何一個普通元素 -->
<div class="layui-form-item">
<label class="layui-form-label">行業類型</label>
<div class="layui-input-block">
<select name="industry" id="industry" lay-filter="industry">
<option value>選擇行業類型</option>
<option value="1001">IT服務</option>
<option value="1002">製造業</option>
<option value="1003">批發/零售</option>
<option value="1004">生活服務</option>
</select>
</div>
</div>
</form>
<script src="layui/layui.js"></script>
<script>
layui.use('form', function(){
var form = layui.form;
});
</script>
可以直接 放到下拉選擇框 select 上 (HTML),這樣預設渲染出來的效果就是這樣的:
<select name="industry" disabled lay-filter="industry">...</select>
也可以用 jq 控制下拉框 select 禁用效果:
<script src="layui/layui.js"></script>
<script>
layui.use('form', function(){
var form = layui.form;
$("#industry").attr("disabled","disabled");
form.render('select');
});
</script>
註意事項:
- 依賴載入模塊:form
- 用js或jq把屬性設置為 disabled
- 最後記得刷新 select 選擇框渲染
form.render('select')