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')

layui下select禁止点击的更多相关文章

  1. layui select 禁止点击

    $('select').attr('disabled', 'disabled'); form.render('select'); 注意事项: 1. 必须写 layui.use([form]) 2. 先 ...

  2. layui下select下拉框不显示或没有效果

    Layui会对select.checkbox.radio等原始元素隐藏,从而进行美化修饰处理.但这需要依赖于form组件,所以你必须加载 form,并且执行一个实例.值得注意的是:导航的Hover效果 ...

  3. Layui:select下拉框回显

    一..需求场景分析 基于Thymeleaf模板下的layui下选框回显. 二.获得一个Layui标配的下拉框,我们需要在html中填写的内容如下 <div class="layui-f ...

  4. JQuery/JS select标签动态设置选中值、设置禁止选择 button按钮禁止点击 select获取选中值

    //**1.设置选中值:(根据索引确定选中值)**// var osel=document.getElementById("selID"); //得到select的ID var o ...

  5. layui的select下拉框太长被遮挡了的解决办法

    layui的select下拉框太长采用滚动条的形式出现,可以给select的dl加一个最大高度,具体的效果如下图 .layui-form-select dl { max-height:160px; }

  6. layui给select下拉框赋值

    转: layui给select下拉框赋值 layui给select下拉框赋值 //重新渲染表单函数 function renderForm() { layui.use('form', function ...

  7. layui下拉框数据过万渲染渲染问题解决方案

    方案一:layui下拉框分页插件 https://fly.layui.com/jie/29002/ 此插件我用了下浏览器缓存有问题,而且当下拉框数据量过万后,会一直渲染不出来,期待后期作者优化 如图下 ...

  8. Android 三档自定义滑动开关,禁止点击功能的实现,用默认的seekbar组件实现

    android三档自定义滑动开关,禁止点击功能的实现,普通开关网上有很多例子,三档滑动开关的则找了整天都没有相关例子,开始用普通开关的源码修改了自己实现了一个类,但效果不如人意,各种边界情况的算法很难 ...

  9. layui之select的option叠加问题解决

    小编我在使用layui,在select的地方遇到了坑,select里的值居然无法清空,select里的option还有叠加问题,为了解决这个问题,也达到我的功能,我研究了下,让有同样需求的小伙伴不踩坑 ...

随机推荐

  1. SecureCRT 按退格键出现 ^H 的解决办法  

    问题如图 打开SecureCRT 界面,最上方工具栏 1.选项→会话选项 2.终端→仿真→映射键 3.其他选项→勾选 Backspace 发送 delete(B) 4.点击确定即可 另外在不可编辑状态 ...

  2. iframe中子父页面跨域通讯

    目录 #跨域发送信息 #跨域接收信息 #示例Demo 在非跨域的情况下,iframe中的子父页面可以很方便的通讯,但是在跨域的情况下,只能通过window.postMessage()方法来向其他页面发 ...

  3. spring boot的一个小项目小型进销存系统

    项目所需的依赖: <dependency> <groupId>org.springframework.boot</groupId> <artifactId&g ...

  4. D - Counting Squares

    Your input is a series of rectangles, one per line. Each rectangle is specified as two points(X,Y) t ...

  5. ElementUI的Table表格添加自定义头CheckBox多选框

    在ElmentUI的Table表格组件中,也许你会使用type为selection值的多选框功能,但是此时设置的label属性不生效,不能设置标题名称:有时候我们的需求就是要添加标题名称,那该如何处理 ...

  6. Java连载85-集合的Contains和Remove方法

    一.包含与删除两种方法解析 1.boolean contains(Object o);判断集合中是否包含某个元素. package com.bjpowernode.java_learning; imp ...

  7. 用windows 画图 裁剪照片

    图片大小432*312 1.裁剪大小:打开画图--找到矩形选择 形状裁剪完之后,像素会有相应的变化 2.单纯调整像素:  打开画图----重新调整大小(去掉保持纵横比之后可以任意调整大小) 题目:上传 ...

  8. Quick Sort(快速排序)

    Quick Sort Let's arrange a deck of cards. Your task is to sort totally n cards. A card consists of a ...

  9. 通过nginx实现多个域名访问同一个服务器

    一台服务器通过nginx配置多个域名(80端口)  参考:https://www.cnblogs.com/ruanjianlaowang/p/11182486.html 1. 问题描述 多个域名对应一 ...

  10. 疫情下的传统商企自救|4个Tips搭建销量过亿直播间

    新冠肺炎爆发以来,线下商企遭受巨大冲击.出于疫情防控需要,不少门店选择暂时停业:而消费者们更是响应号召.足不出户.这场疫情促使消费者的消费习惯和方式进一步转向线上订购转变,直播.短视频等领域逆势而起, ...