bootstrap中文网（）里推荐项目有Flat UI（），非常漂亮，而且少有的竟然具有select下拉框。
我直接打开example（Flat-UI-master/docs/examples/select.html）都是可以的，但是放到我的网站里则不行。
使用chrome调试经过分析，原因是：
$('[data-toggle="select"]').select2();这行代码读不到，，只要引入即可。select2是Flat UI的函数，在flat-ui.js中定义：
$.fn.select2 = function () {var args = Array.prototype.slice.call(arguments, 0),opts,select2,method, value, multiple,allowedMethods = ["val", "destroy", "opened", "open", "close", "focus", "isFocused", "container", "dropdown", "onSortStart", "onSortEnd", "enable", "disable", "readonly", "positionDropdown", "data", "search"],valueMethods = ["opened", "isFocused", "container", "dropdown"],propertyMethods = ["val", "data"],methodsMap = { search: "externalSearch" };this.each(function () {if (args.length === 0 || typeof(args[0]) === "object") {opts = args.length === 0 ? {} : $.extend({}, args[0]);opts.element = $(this);if (opts.element.get(0).tagName.toLowerCase() === "select") {multiple = opts.element.prop("multiple");} else {multiple = opts.multiple || false;if ("tags" in opts) {opts.multiple = multiple = true;}}select2 = multiple ? new window.Select2["class"].multi() : new window.Select2["class"].single();select2.init(opts);} else if (typeof(args[0]) === "string") {if (indexOf(args[0], allowedMethods) < 0) {throw "Unknown method: " + args[0];}value = undefined;select2 = $(this).data("select2");if (select2 === undefined) return;method=args[0];if (method === "container") {value = select2.container;} else if (method === "dropdown") {value = select2.dropdown;} else {if (methodsMap[method]) method = methodsMap[method];value = select2[method].apply(select2, args.slice(1));}if (indexOf(args[0], valueMethods) >= 0|| (indexOf(args[0], propertyMethods) >= 0 && args.length == 1)) {return false; // abort the iteration, ready to return first matched value}} else {throw "Invalid arguments to select2 plugin: " + args;}});return (value === undefined) ? this : value;};
不过ie8还是不行，原因还在核查中。经过一上午研究，发现flat ui还是不好用，我还得需要花时间解决ie8的问题，但是我的时间并不充裕。看来只能放弃，还是沿用jQuery ui更合适一些。
总结一些flat ui的select使用方法：
<!– Loading Bootstrap<link href="scripts/Flat-UI-master/dist/css/vendor/bootstrap.min.css" rel="stylesheet">–><!– Loading Flat UI<link href="scripts/Flat-UI-master/dist/css/flat-ui.css" rel="stylesheet">–><!– HTML5 shim, for IE6-8 support of HTML5 elements. All other JS at the end of file. –><!–[if lt IE 8]><script src="scripts/Flat-UI-master/dist/js/vendor/html5shiv.js"></script><script src="scripts/Flat-UI-master/dist/js/vendor/respond.min.js"></script><![endif]–> <select data-toggle="select" class="form-control select select-danger mrs mbm"> <option value="EVERYDAY">实时</option> <option value="BILLING">计费</option> </select>
<!– jQuery (necessary for Bootstrap's JavaScript plugins)<script src="scripts/Flat-UI-master/dist/js/vendor/jquery.min.js"></script><!– Include all compiled plugins (below), or include individual files as needed<script src="scripts/Flat-UI-master/dist/js/flat-ui.js"></script><script>$('[data-toggle="select"]').select2();</script>
注意：
1、必须先引入了bootstrap，再引入flat ui；
2、[if lt IE 8]原来官方是[if lt IE 9]，我用ie8会保错，需要改为8，否则会报错Flat-UI-master/dist/js/vendor/respond.min.js拒绝访问；
3、这种样式是select.html里的样式，和我上面的截图有点差别；
本文出处：ouyida3的csdn blog
2015.3.4
青春一经典当即永不再赎
