Question

我想创建一个HTML自定义选择组合框。有哪些库可以做到这一点？或者如何使用CSS做到这一点？

示例：Gmail注册样式chombo框

Answer 1

请参阅此网址：

http://harvesthq.github.com/chosen/

http://twitter.github.com/bootstrap/components.html

Answer 2

这是一个使用jQuery的想法：

$('#your-select-id').each(function(){
        var title = $('option:selected', this).text();
        if( $('option:selected', this).val() != ''  ) title = $('option:selected',this).text();
        $(this)
            .css({'z-index':10,'opacity':0,'-khtml-appearance':'none'})
            .after('<span class="select-overlay">' + title + '</span>')
            .change(function(){
                val = $('option:selected',this).text();
                $(this).next().text(val);
            })
        });

这样做会在（span“select-overlay”）中添加一个可设置的叠加层，并使选择框不可见并位于顶部。当用户点击它时，他们会从默认选择框中获取选项，并在更改时更新范围。

如果您下次提出问题时所做的任何尝试都会很好。

Answer 3

<select>框不可能在浏览器中一致地设置样式。您需要某种选择框替换脚本。有一些很好的可用于jQuery，例如Uniform，它将很好的样式应用于所有表单元素。 jQuery UI也有一个模块，但目前仍处于测试阶段......

HTML自定义选择

3 个答案: