selectpicker -- 一款好用的select插件

selectpicker依赖bootstrap，bootstrap依赖jquery

<!DOCTYPE html>
<html lang="">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Title Page</title>
        <link href="https://cdn.bootcss.com/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

        <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
        <script src="https://cdn.bootcss.com/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
        <link href="https://cdn.bootcss.com/bootstrap-select/1.13.10/css/bootstrap-select.min.css" rel="stylesheet">
        <script src="https://cdn.bootcss.com/bootstrap-select/1.13.10/js/bootstrap-select.min.js"></script>
        <script src="https://cdn.bootcss.com/bootstrap-select/1.13.10/js/i18n/defaults-zh_CN.min.js"></script>
        
    </head>
    <body>
        <form>
　　　　　　　　// data-max-options="1"  最大能选择一个
            <select class="selectpicker" data-live-search="true" data-max-options="1" data-style="btn-primary" id="guide_city">
            </select>
            <button type="button" class="btn btn-primary" id="guide_submit">提交</button>
        </form>
      
    </body>
    <script type="text/javascript">
        let guideJsonArray = [{"city_id":"10065","city_name":"北京"},{"city_id":"10099","city_name":"上海"},{"city_id":"10208","city_name":"重庆"}]
        let htmlStr = "";
        for(let i in guideJsonArray){
            htmlStr += '<option value="'+ guideJsonArray[i].city_id +'">'+ guideJsonArray[i].city_name +'</option>'
        }
　　　　 // 给selectpicker赋值
        $("#guide_city").html(htmlStr);
        $('#guide_city').selectpicker('refresh');//动态刷新

        $("#guide_submit").click(function(){
            console.log($("#guide_city").val());　　　　　　　　　　　　　　// 获取选中的option的值　　
　　　　　　　console.log($("#guidecity").find("option:selected").text(); // 获取选中的option的text
        });
    </script>
</html>

相关阅读:
Python 函数
jQuery的选择器中的通配符
Spring thymeleaf
Mybatis 映射关系
Spring Security学习笔记
Python中的魔术方法
Python enumerate
python lambda表达式
Vue自定义指令完成按钮级别的权限判断
elemetUI开关状态误操作

原文地址：https://www.cnblogs.com/knightdreams6/p/10974708.html