zoukankan      html  css  js  c++  java
  • Bootstrap Multiselect

    1. Link the Required Files

      First, the jQuery library needs to be included. Then Twitter Bootstrap - both the Javascript library and the CSS stylesheet - needs to be included.

      1. <!-- Include Twitter Bootstrap and jQuery: -->
      2. <link rel="stylesheet" href="css/bootstrap.min.css" type="text/css"/>
      3. <script type="text/javascript" src="js/jquery.min.js"></script>
      4. <script type="text/javascript" src="js/bootstrap.min.js"></script>
      5.  
      6. <!-- Include the plugin's CSS and JS: -->
      7. <script type="text/javascript" src="js/bootstrap-multiselect.js"></script>
      8. <link rel="stylesheet" href="css/bootstrap-multiselect.css" type="text/css"/>

      The jQuery library can also be included using a CDN, for example the Google CDN:

      1. <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

      Note that the plugin will work both with version 2.x of the jQuery library as well as with version 1.10.x of the jQuery library. So for using the Google CDN you may have to adjust the version.

    2. Create a Select

      Now simply use HTML to create your select input which you want to turn into a multiselect. Remember to set the multipleattribute as to get a real multiselect - but do not worry, the plugin can also be used as usual select without the multipleattribute being present.

      1. <!-- Build your select: -->
      2. <select id="example-getting-started" multiple="multiple">
      3. <option value="cheese">Cheese</option>
      4. <option value="tomatoes">Tomatoes</option>
      5. <option value="mozarella">Mozzarella</option>
      6. <option value="mushrooms">Mushrooms</option>
      7. <option value="pepperoni">Pepperoni</option>
      8. <option value="onions">Onions</option>
      9. </select>
    3. Call the Plugin

      In the end, simply call the plugin on your select. You may also specify further options, see the Options tab for further information.

      1. <!-- Initialize the plugin: -->
      2. <script type="text/javascript">
      3. $(document).ready(function() {
      4. $('#example-getting-started').multiselect();
      5. });
      6. </script>
  • 相关阅读:
    SVN报错working copy is not uptodate
    AndroidStudio中获得的VersionCode一直为1和VersionName一直为1.0
    OkHttp
    MockWebServer使用指南(转载)
    Android的Toolbar(含溢出菜单设置[弹出菜单的使用])的使用PopMenu的样式
    8-13笔记-安卓兼容
    自定义Dialog
    安卓圆角Button XML文件
    递归方法扫面文件夹(JAVA控制台程序)
    8月12笔记-安卓文件扫描
  • 原文地址:https://www.cnblogs.com/telwanggs/p/9247064.html
Copyright © 2011-2022 走看看