layui框架问题总结(点击按钮为select添加option选项)
来源:互联网 发布:支持网络连接的电视 编辑:程序博客网 时间:2024/06/03 17:51
引入layui.js和layui.css
html
<form class="layui-form" action=""> <div class="layui-form-item proSelect"> <label class="layui-form-label">产品类别</label> <div class="layui-input-block editWidth"> <select name="productList" lay-verify="required" id="zcySelect"> <option value=""></option> <option value="0">轻松融</option> <option value="1">容易融</option> <option value="2">快乐融</option> </select> </div> </div> <a class="layui-btn layui-btn-small" id="" onclick="addProductClassify()">增加产品类别</a></form><!--弹窗内容--><div id="select_prod" class="layui-form" hidden="hidden"> <div class="layui-input-inline"> <input type="text" name="text" required lay-verify="required" placeholder="" autocomplete="off" class="layui-input"> </div></div>
js
//重新渲染表单function renderForm(){ layui.use('form', function(){ var form = layui.form(); form.render(); }); }//增加产品类别按钮点击事件function addProductClassify(){ layer.open({ type:1, btn:['确定','取消'], content:$("#select_prod"), area:['270px','160px'], //当前层索引参数(index)、当前层的DOM对象(layero) yes:function(index,layero){ //获取input输入的值 var ivalue=$(layero).find("input").val(); //获取要添加的option的索引 var sIndex=$("#zcySelect")[0].options.length-1; if(ivalue==null||ivalue==''){ layer.msg("请输入产品类别") } else{ layer.msg("输入的产品类别是:"+ivalue); //为select添加option $("#zcySelect").append("<option value="+sIndex+">"+ivalue+"</option>"); renderForm();//表单重新渲染,要不然添加完显示不出来新的option layer.close(index); } $(layero).find("input").val(''); } })}
阅读全文
0 0
- layui框架问题总结(点击按钮为select添加option选项)
- layui select动态添加option
- 为select动态添加option问题
- select动态添加option与动态设置下拉框默认选项(selected)的问题(原创)
- select option 问题总结
- 添加移除 select option选项
- jquery向select 添加选项option
- 原生JS给SELECT添加OPTION选项
- 【Jquery】jquery为select添加option
- easyUI中select下拉框添加option选项
- select下拉列表, 从数据库查询,动态添加选项option
- 利用js给datalist或select动态添加option选项
- jqgrid表格列选项edittype为text、checkbox、select、textarea、function、超链接,添加自定义按钮
- jqgrid表格列选项edittype为text、checkbox、select、textarea、function、超链接,添加自定义按钮
- Jquery mobile为select动态添加option后,无法正常显示的问题
- 删除和添加select下拉框选中的内容option,以及清空option选项
- 动态添加select的option (转)
- 删除select下option选项
- FaceBoxes —— CPU上实时的人脸检测
- Python-pygorithm的使用
- iOS开发中微信支付集成
- 理解 JavaScript 的 async/await
- iOS自动打包并发布IPA脚本
- layui框架问题总结(点击按钮为select添加option选项)
- Android---OkHttp
- dataguard 主备切换
- Linux之 手动释放内存
- Linux VNC server的安装及简单配置使用
- json中删除一个集合
- C++ set容器用法
- 用Python获取网页数据
- Source Insight4.0 中文注释乱码的解决办法