zoukankan      html  css  js  c++  java
  • LayUI 多选框动态加载、启用、禁用、赋值、取值等js实现

      例如多选框如下:

    <div class="layui-form">
        <select xm-select="city">
        </select>
    </div>
    

      动态加载:

    var url = "加载路径";
    View.get(url, "city=" + city, function(resp) {
      if (resp) {
        var html = "";
        for (var i = 0; i < resp.length; i++) {
          html += "<option value='" + resp[i].key + "'>" + resp[i].value +"</option>";
        }
        $("select[xm-select='city']").html(html);
        }
        layui.formSelects.render();// 重新渲染多选框
    }, function() {
    });
    

      重新渲染多选框:

    layui.formSelects.render();
    

      例如多选框如下:

    <div class="layui-form">
        <select name="city" xm-select="city_2">
            <option value="1" selected="selected">北京</option>
            <option value="2">上海</option>
            <option value="3">广州</option>
            <option value="4">深圳</option>
            <option value="5">天津</option>
        </select>
    </div>
    

      禁用:

    $("select[xm-select='city_2']").attr("disabled", "disabled");
    layui.formSelects.render();
    

      启用:

    $("select[xm-select='city_2']").attr("disabled", false);
    layui.formSelects.render();
    

      赋值:

    layui.formSelects.value('city_2', []);          //赋值空数组, 清空所有
    layui.formSelects.value('city_2', [1, 2]);      //赋值 北京,上海
    layui.formSelects.value('city_2', [5], true);   //追加赋值 天津
    layui.formSelects.value('city_2', [1], false);  //删除 已选择 [北京]
    

      取值:

    layui.formSelects.value('city_2');              //取值默认数组
    layui.formSelects.value('city_2', 'val');       //取值val数组
    layui.formSelects.value('city_2', 'valStr');    //取值val字符串
    layui.formSelects.value('city_2', 'name');      //取值name数组
    layui.formSelects.value('city_2', 'nameStr');   //取值name字符串
    

      取值结果:

      取值默认数组:[{"name":"北京","value":"1"}]

      取值val数组:["1"]

      取值val字符串:"1"

      取值name数组:["北京"]

      取值name字符串:"北京"

      详细官网文档:https://fly.layui.com/extend/formSelects/

             http://sun.faysunshine.com/layui/formSelects-v4/example/example_v4.html

  • 相关阅读:
    嵌入式 coredump
    CentOS7 systemctrl管理的服务,open files的神坑
    Linux 服务器网络流量查看工具
    shiro源码篇
    google guava
    Docker虚拟化管理:30分钟教你学会用Docker
    Shiro结合Redis实现分布式或集群环境下的Session共享
    Springboot整合redis
    Git分支操作方法
    Redis启动和在注册到windows服务
  • 原文地址:https://www.cnblogs.com/Big-Boss/p/11365174.html
Copyright © 2011-2022 走看看