LayUI实现Checkbox复选框的单选及取消单选,即只能选一个或者全都不选
生活随笔
收集整理的這篇文章主要介紹了
LayUI实现Checkbox复选框的单选及取消单选,即只能选一个或者全都不选
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
項目用LayUI進行開發,需求方提出一個范圍權限控制的實現方案。在復選框只能單選的前提下,管理員可以取消勾選,查看所有數據,但普通用戶由于權限限制,不可以取消勾選。
在查找資料的過程中,發現jq的常用操作checkbox方法不適用于layui,應使用prop代替attr改變checkbox狀態。
<input type="checkbox" name="chbBtn" value="@item.ScopeExtand" title="@item.name" lay-skin="primary" lay-filter="oneChoose">form.on('checkbox(oneChoose)', function (data) { if (@ViewBag.Islimited.ToString().ToLower() == true) { //權限限制不能全部取消勾選$("input[name='chbBtn']").prop("checked", false); ? //全部取消選中$(this).prop("checked", true); ? ? ? ? ? ? ? ? ? ? ?//勾選當前選中的選擇框}else {if(data.elem.checked || data.elem.checked=='true'){$("#divSearchBtns input:checkbox").prop("checked",false);$(this).prop("checked", true);}} form.render('checkbox');});form.render('checkbox');最后,一定不要忘記使用form.render()方法進行渲染。
總結
以上是生活随笔為你收集整理的LayUI实现Checkbox复选框的单选及取消单选,即只能选一个或者全都不选的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 首个Adobe XD教程丨如何用Adob
- 下一篇: 深圳高新区发展专项计划管理办法(征求意见