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. 使用Go语言编写区块链P2P网络(译)(转)

    转自:https://mp.weixin.qq.com/s/2daFH9Ej5fVlWmpsN5HZzw 外文链接: https://medium.com/coinmonks/code-a-simpl ...

  2. Eclipse:An error has occurred. See error log for more details. java.lang.NullPointerException

    问题描述   在使用 Eclipse Clean 项目时报错:An error has occurred. See error log for more details. java.lang.Null ...

  3. 关于mvc中传递匿名对象,view中无法解析

    最近做项目用到MVC,发现用linq查询得到的数据是匿名类型对象,通过模型绑定.或者ViewBag.ViewData进行数据传递后,View解析报错:“object 未包含xx的定义”: 没找到好的解 ...

  4. js特殊符号(转)

    HTML有许多特殊的字符,您对此有多少了解?平时在WEB制作中,您又有用到多少?或者说你在平时使用之时,是否也会碰到,有许多特殊字符要如何打印出来?比如说“笑脸”,比如说“版权号”.要是你用时忘记了这 ...

  5. SpringCloud使用Feign调用其他客户端带参数的接口,传入参数为null或报错status 405 reading IndexService#del(Integer);

    SpringCloud使用Feign调用其他客户端带参数的接口,传入参数为null或报错status 405 reading IndexService#del(Integer); 第一种方法: 如果你 ...

  6. 2018-2019-2 网络对抗技术 20165328 Exp5 MSF基础应用

    目录 实验要求: 基础问题回答: 离实战还缺些什么技术或步骤? 实验内容: Exp5-1 主动攻击实践:实现ms08_067(失败) 实现ms17_010_eternalblue(成功) Exp5-2 ...

  7. Redis数据类型SortedSET

    Sorted Set有点像Set和Hash的结合体.和Set一样,它里面的元素是唯一的,类型是String,所以它可以理解为就是一个Set.但是Set里面的元素是无序的,而Sorted Set里面的元 ...

  8. sql server 实现split功能 行转列

    --實現split功能的函數create function [dbo].[func_split]( @SourceSql varchar(max), @StrSeprate varchar(10))r ...

  9. XML数据读取——Digester简单使用

    >>>>>>>>>>>>>>>>>>>>>>>>> ...

  10. html_Dom

    Document: 每个载入浏览器的HTML文档都会成为一个Document对象. Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问. 并且Document 对象是 Wi ...