使用layui 和 jquery 问题小结
问题
1 在使用 layui 2.2.5 之前,可以引入最新版的 jquery ,使用更好的性能。也可以使用layui 的jquery内部版本。如果引入要在引入layui.js 之前引入
2 使用 select 的动态添加 option 元素时,一直不能渲染出来。后来上网查看资料,发现在更新过表单元素后要使用 form.render() 重新渲染。代码如下
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>layuitest</title> <link rel="stylesheet" href="../js/layui/css/layui.css"> <script src="../js/jquery/jquery-3.3.1.min.js"></script> <script src="../js/layui/layui.js"></script> </head> <body> <div class="layui-form "> <form> <div class="layui-form-item"> <label class="layui-form-label">城市</label> <div class="layui-input-block"> <select name="city" id="label_select"> <option value="">请选择城市</option> <option value="1">北京</option> <option value="2">上海</option> </select> </div> </div> </form> </div> <script> $(function () { layui.use(["layer","form"],function () { var layer = layui.layer, form = layui.form; $("#btnAppend").click(function () { var html = '<p>good</p>'; $("#testId").append(html); }); var html = "<option value='3'>深圳</option>" ; $("#label_select").append(html); layer.msg("添加了元素"); form.render(); }) }); </script> </body> </html>
页面加载后就会动态添加选项
学习过程中,难免出错。如果您在阅读过程中遇到不太明白,或者有疑问。欢迎指正...联系邮箱crazyCodeLove@163.com
如果觉得有用,想赞助一下请移步赞助页面:赞助一下