1.需要引用form模板

layui.use(['form'], function () {
var form = layui.form;
});

2.html代码

<div class="layui-form">
<select name="city" lay-verify="" lay-filter="test" id="select">
<option value="">请选择一个城市</option>
<option value="010">北京</option>
<option value="021">上海</option>
<option value="0571">杭州</option>
</select>
</div>

注:当需要动态生成select选项时,如果没有layui的下拉效果,需要在生成完dom结构之后form.render();一下,重新渲染。这里的form是第1点模板中的form变量。

如果还没有效果,注意是不是没有在外层嵌套div.layui-form

3.获取select值

像平时获取select值就可以了。例如$("#select").val();

4.select赋值

也是像平时一样select赋值就行。例如$("#select").val(”010“);

5.select的change事件

需要在select标签上增加lay-filter="test",test可以随意命名。

form.on('select(test)', function (data) {
//TODO执行自己的代码
});

注:select(test)里面的test和lay-filter的值一样即可。

6.遇到的问题

问题描述:在layer弹框中,如果使用parent.layer.open()弹出一个弹框,之后success回调渲染select,select没有效果。

layui select使用问题的更多相关文章

  1. layui select 下拉框 级联 动态赋值 与获取选中值

    //下拉框必须在 class="layui-form" 里 不然监听事件没有作用 <div class="layui-form" > <div ...

  2. layui select配合input实现动态模糊搜索

    功能需求:select框可以自己输入,就是在下拉列表里找不到自己想要的选项就可以自己输入,同时还要支持模糊匹配功能 html代码: 样式: <style> .select-search-i ...

  3. layui select 选完其他选项, 手工清空选项 又恢复最初的选项?

    启用layui的select  下拉搜索项: lay-search <div class="layui-inline"> <label class="l ...

  4. layui select 禁止点击

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

  5. shit layui & select & re-render & bug

    shit layui https://www.layui.com/doc/modules/form.html#onselect https://www.layui.com/doc/element/fo ...

  6. layui select change

    <select lay-filter="test"></select> layui.use([ 'form'], function() { var form ...

  7. layui select 联动渲染赋值不了数据的问题

    今天用 layui做select的时候,数据老是看不到,而且联动的数据是对不上的,看了网上一堆是 最后要用 form.render('select'); 这个是必须的, 但是我用了还是这样,其实是la ...

  8. layui select动态添加option

    <form class="layui-form" action=""> <div class="layui-form-item pr ...

  9. 动态设置 layui select 为选中状态

    // 当前的select的id $('#type').val('你的value值'); //更新全部 layui.form.render();

随机推荐

  1. Agiliq署名的免费python书籍

    在他们的官网介绍中,说他们团队自2009年开始使用Django,Python,Postgres,Augular等工具来开发webapp,移动应用后台等.并且,他们还有一个Github组织,开源了相当多 ...

  2. Pompholyx - Causes, Symptoms and Treatment

    Pompholyx is a common type of eczema. It is also known as dyshidrotic eczema or vesicular eczema of ...

  3. Mac本地搭建kubernetes环境

    前言:之前在windows上面的虚拟机上面手工搭建了kubernetes集群,但是环境被破坏了,最近想要继续学习k8s,手工搭建太费事,所以选择了minikube,完全能够满足个人的需求,其实在Win ...

  4. hololens Vuforia新时期的开发注意事项

    首先是导入的时候unity版本 HolotoolKit的版本 是否搭配.按照推荐的版本号去下载安装: 其次是在原本的相机的设置. View of field 大小设置为60,不然会造成页面的放大,然后 ...

  5. mysql 函数学习(常用)

    1.时间函数(组1) SELECT CURRENT_DATE() AS date, CURRENT_TIME() AS `time`, CURRENT_TIMESTAMP() AS `timestam ...

  6. 学习java23种设计模式自我总结

    首先先做个广告,以前看过@maowang 这位大神转的Java开发中的23种设计模式详解(转) ,但是看了之后都忘差不多了, 所以,开个帖子边学习边自我总结(纯手敲).一直以来像这种需要长久的运动,真 ...

  7. python Django2.X,报错 ‘learning_logs ’is not a registered namespace,如何解决?

    自己也查阅了自己出现了的问题,其中就有这么个按照书中来写的代码但是Django却是提示了  ‘learning_logs ’is not a registered namespace. 然后错误提示可 ...

  8. python-数据类型之题型

    1.让用户输入任意字符串,获取字符串之后并计算其中有多少个数字. total = 0 text = input("请输入内容") a = 0 while a <len(tex ...

  9. ceph hammer 0.94.10手动部署方法Ceph Hammer版(0.94.10)手动部署for CentOS 7.x

    Ceph Hammer版(0.94.10)手动部署for CentOS 7.x --lin.wang 20190310 环境有三个节点node-1,node-2,node-3,每个节点三个ssd盘作为 ...

  10. Kubernetes 1.10.0离线安装

    讲述如何通过离线的方式安装Kubernetes,主要用于对Kubernetes的研究学习,不建议在生产环境使用,安装包获取地址: 链接:https://pan.baidu.com/s/1nX5_mem ...