插件描述：js自定義select下拉框，兩種風(fēng)格很好用哦

tastySelect

tastySelect是一款純js超酷select下拉框美化插件。tastySelect下拉框插件支持多選，內(nèi)置兩種主題，使用CSS3動(dòng)畫過渡效果，整體設(shè)計(jì)時(shí)尚大方。

使用方法

在頁面中引入tastySelect.css和tastySelect.min.js文件。

HTML結(jié)構(gòu)

如果要?jiǎng)?chuàng)建多選的下拉選擇框，它的HTML結(jié)構(gòu)如下：

jQuery

ReactJS

AngularJS

HTML?5

XML

XHTML

CSS/SCSS/LESS

More?Options?Here

初始化插件

通過tastySelect()方法來初始化該select下拉框美化插件。tastySelect({

defaultText:?"通過?(Ctrl+Click)組合鍵可以選擇多個(gè)選項(xiàng)",

});

配置參數(shù)

tastySelect下拉框插件的可用配置參數(shù)如下：tastySelect({

selector:?'select',

mobileFix:?true,

mask:?'%',

maskJoin:?',?',

defaultText:?'Select?item...',

classes?:?{

outer:?'style-select',

title:?'style-select-title',

options:?'style-select-options',

label:?'style-select-label',

optgroup:?'style-select-optgroup',

list:?'style-select-list',

item:?'style-select-option',

open:?'st_open',

selected:?'st_selected',

mobile:?'is_mobile',

},

attributes?:?{

index:?'data-index',

value:?'data-value',

selectReady:?'data-tastyselect',

},

});

總結(jié)

以上是生活随笔為你收集整理的html三级下拉栏插件,纯js超酷下拉框插件tastySelect的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。