• 原来你是这样的"layui"啊


    1,,vue安装layui:

    安装比较粗暴,直接下载官网的压缩包放在static文件夹下,在index中全局引用。

    2,如果要使用layui一定要看文档,当然你要是没耐心可以边写边看文档,文档很详细。如果你用vue的话建议不要用layui。

    遇到的问题:

    (1) form中的radio,select,checkbox不能及时渲染;

          使用form.render();

    (2)表单复选框中的全选:

     

    a,通过“lay-filter”将复选框分组:

     <div class="layui-input-block">

       <input type="checkbox" name="plat" value="0" lay-skin="primary" lay-filter="plat" title="全部">

       <input type="checkbox" name="plat" value="1" lay-skin="primary" lay-filter="plat" title="iOS">

       <input type="checkbox" name="plat" value="2" lay-skin="primary" lay-filter="plat" title="android">

      <input type="checkbox" name="plat" value="3" lay-skin="primary" lay-filter="plat" title="其他">

    </div>

    b. 结合layui定义的复选框事件

     1 form.on('checkbox(filter)', function(data){
     2 
     3  var child = $(data.elem).siblings('input[type="checkbox"]');   //当前点击按钮的兄弟节点
     4 
     5   If(data.elem.checked){                 //是否被选中,true或者false
     6 
     7   if (data.value == "0") {             //当value==0是是全选状态
     8 
     9         message = [];
    10 
    11         child.each(function (index, item) {
    12 
    13           item.checked = data.elem.checked;
    14 
    15           message.push(item.value);
    16 
    17         });
    18 
    19    } else {
    20 
    21           message.push(data.value);
    22 
    23           if (message.length == num) {
    24 
    25              $(data.elem).parent().children("input").get(0).checked = true;
    26 
    27           }
    28 
    29         }
    30 
    31 }               
    32 
    33 });     

    (3)复选框回显:

      Initialize('sex', [1,2,3], 3);

     1   Initialize(type, message, count) {
     2 
     3         layui.use('form', function () {
     4 
     5           Let item = [];
     6 
     7           var form = layui.form,
     8 
     9             $ = layui.jquery;
    10 
    11 //         type 为input 的name值
    12 
    13           $('input[name=' + type + ']').each(function () {
    14 
    15             if (message[0] == 0 || message.length == count) {
    16 
    17               this.checked = true;
    18 
    19               itme.push(this.value);
    20 
    21             } else {
    22 
    23               for (let j = 0, l = message; j < l.length; j++) {
    24 
    25                 if (this.value == l[j]) {
    26 
    27                   this.checked = true;
    28 
    29                   itme.push(this.value);
    30 
    31                 }
    32 
    33               }
    34 
    35             }
    36 
    37             form.render();
    38 
    39           });
    40 
    41         });
    42 
    43 Return item;
    44 
    45       },
  • 相关阅读:
    BZOJ 3282: Tree( LCT )
    BZOJ 3713: [PA2014]Iloczyn( 枚举 )
    HDU3974
    CodeForces220B
    POJ2349
    HDU3038
    POJ1611
    IELTS
    POJ1125
    POJ2109
  • 原文地址:https://www.cnblogs.com/wxx-17-5-13/p/10288080.html
Copyright © 2020-2023  润新知