selectordie演示11种美化下拉框select方法

HTML

<div class="select">
    <select class="myselect">
        <option value="交互设计">交互设计</option>
        <option value="视觉设计">视觉设计</option>
        <optgroup label="开发">
            <option value="前端开发">前端开发</option>
            <option value="后端开发">后端开发</option>
        </optgroup>
        <option value="用户研究">用户研究</option>
        <option value="产品经理">产品经理</option>
    </select>
</div>

调用selectordie插件

<script type="text/javascript" src="jquery.js"></script> 
<script src="js/selectordie.min.js"></script>
<script>
$(function() {
    $('select').selectOrDie();
});
<script>

Select-or-Die 有如下 data 自定义属性：

<ul class='ul_demo'> <li><strong>data-custom-id</strong> – 绑定 id</li> <li><strong>data-custom-class</strong> – 绑定 class</li> <li><strong>data-placeholder</strong> – 占位符</li> <li><strong>data-prefix</strong> – 添加前缀</li> <li><strong>data-cycle</strong> – 键盘控制是否循环</li> <li><strong>data-links</strong> – 跳转到链接</li> <li><strong>data-size</strong> – 跳转到外部链接</li> <li><strong>data-tabindex</strong> – 设置 tabindex</li> </ul>