zoukankan      html  css  js  c++  java
  • 简单的方法 实现下拉框多选

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8"/>
        <title>Demos</title>
        <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.css" />
        <link rel="stylesheet" href="../multiple-select.css" />
    </head>
    <body>
    <div class="container">
            <div class="form-group">
            <label>Month:</label>
            <select id="ms" multiple="multiple">
                <option value="1">January</option>
                <option value="2">February</option>
                <option value="3">March</option>
                <option value="4">April</option>
                <option value="5">May</option>
                <option value="6">June</option>
                <option value="7">July</option>
                <option value="8">August</option>
                <option value="9">September</option>
                <option value="10">October</option>
                <option value="11">November</option>
                <option value="12">December</option>
            </select>
        </div>
    </div>
    
    <script src="assets/jquery.min.js"></script>
    <script src="../multiple-select.js"></script>
    <script>
        $(function() {
            $('#ms').multipleSelect({
                //控件宽度
                 460,
                //全选字体样式
                selectAllText:'全选',
                // 支持在一行中显示多个选项
                multiple: true,
                multipleWidth: 100,
                //placeholder
                 placeholder: "请选择"
            });
        });
    </script>
    </body>
    </html>



     

    具体下载链接,感谢博主

    http://wenzhixin.net.cn/p/multiple-select/docs/index.html?locale=zh_CN

  • 相关阅读:
    原生代码实现Promise
    HTTP与HTTPS的区别
    windows常用命令-长期更新
    git 常用命令
    原型和原型链
    vue 中一些API 或属性的常见用法
    移动端屏幕适配
    Nuxt.js(开启SSR渲染)
    vue+element-ui 实现分页(根据el-table内容变换的分页)
    vue中引入jQuery和bootstrap
  • 原文地址:https://www.cnblogs.com/silences/p/5531814.html
Copyright © 2011-2022 走看看