Bootstrap Flat UI's Select drop-down box displays problem resolution

Bootstrap Chinese web (http://www.bootcss.com/) Recommended project has flat UI (http://www.bootcss.com/p/flat-ui/), very beautiful, and few unexpectedly have a select drop-down box.

I open example directly (flat-ui-master/docs/examples/select.html) is OK, but put on my website is not.

Using chrome debugging has been analyzed because:

$ (' [data-toggle= ' select '] '). Select2 ();

This line of code cannot be read, as long as it is introduced. Select2 is a function of the flat UI, defined in Flat-ui.js:

    $.fn.select2 = function () {var args = Array.prototype.slice.call (arguments, 0), opts, S Elect2, method, value, multiple, Allowedmethods = ["Val", "Destroy", "opened", "open", "close", "FOC US "," 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.len Gth = = 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; };

But IE8 still can't, the reason is still in check.
After a morning study, I found that the flat UI was not good, and I had to take the time to solve the IE8 problem, but I didn't have enough time. It seems that you can only give up or use the jquery UI more appropriately.

Summarize some of the flat UI's Select usage methods:

    <!--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" &G t; real-time </option> <option value= "Billing" > 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>

Attention:

1, must first introduce the bootstrap, and then introduce the flat UI;

2, [If LT ie 8] The original official is [if LT ie 9], I use IE8 will be guaranteed wrong, need to change to 8, otherwise will error flat-ui-master/dist/js/vendor/respond.min.js denied access;

3, this style is select.html in the style, and I above a little difference;

The source of this article: Ouyida3 's CSDN Blog

2015.3.4

Bootstrap Flat UI's Select drop-down box displays problem resolution