使用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="">北京</option>

                        <option value="">上海</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>

页面加载后就会动态添加选项

秒客网

使用layui 和 jquery 问题小结

相关文章