layui的select框不出来怎么办


本文摘自PHP中文网,作者藏色散人,侵删。

layui的select框不出来是因为Layui会对select、checkbox、radio等原始元素隐藏,其解决办法就是加载form,并且执行一个实例即可。

本教程操作环境:Windows7系统、layui1.0版,Dell G3电脑。

推荐:《javascript基础教程》《layUI教程》

今天用layui写前端页面时候用到了通过jqurey中的befor追加select元素

一开始写法:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

<div class="layui-form-item">

    <label class="layui-form-label">执行人员</label>

    <div  style="width: 150px;display: inline-block;" >

      <select name="city">

        <option value="">选择部门</option>

        <option value="0">北京</option>

      </select>

       </div>---

        <div style="width: 150px;display: inline-block;">

      <select name="city" >

        <option value="">选择人员</option>

        <option value="0">张三</option>

      </select>

 </div>

  

 <button type="button" class="layui-btn" id="addpeop">

  <i class="layui-icon">&#xe608;</i>

</button>

</div>

<script>

$(function(){

$("#addpeop").click(function(){

var peop=$("#addpeod");

var t=$(['<label class="layui-form-label"></label>',

       '<div  style="width: 150px;display: inline-block;" >',

               '<select name="city">',

           '<option value="">选择部门</option>',

          '<option value="0">北京</option>',

         '</select>',

          '</div>---',

           '<div style="width: 150px;display: inline-block;">',

        ' <select name="city" >',

          ' <option value="">选择人员</option>',

               '<option value="0">张三</option>',

               '</select>',

       '</div>',

       '<button type="button" class="layui-btn layui-btn-xs layui-btn-danger" id="del">删除</button>'].join(''));

t.find('#del').on('click', function(){

t1.remove();

        });

peop.append(t);

    

})

})

</script>

页面内容:

阅读剩余部分

相关阅读 >>

layui是前端框架吗

为laydate输入框加上图标的方法(附代码)

layui分页怎么用

layui表格支持自适应吗

layui的模块是什么意思?

layui上传图片成功之后怎么预览成功的图片

layui前端框架弹出form表单以及提交的方法

使用layui怎么下载文件

layui表格数据变更的一种处理方式

layui怎么弹出form

更多相关阅读请进入《layui》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...