转换选择Twitter引导程序

时间:2012-06-13 02:54:55

标签: twitter-bootstrap

我正在尝试应用此脚本http://blog.iamjamoy.com/convert-select-boxes-to-a-fancy-html-dropdown将元素转换为引导程序drodown

它在这一行的IE中打破了

$(e).find('option')。each(function(o,q){

这是代码

$this.each(function(i, e){
        if (!($(e).data('convert') == 'no')) {

            //get some initial data...
            xSelect = $(e).attr('id');
            xLabel =  $("#"+xSelect +  " option:selected").text();
            xClass =  $(e).data('class');

            $(e).hide().wrap('<div class="btn-group" id="xSelect-group-' + i + '" />');
            var select = $('#xSelect-group-' + i);

            select.html('<a class="btn dropdown-toggle '+ xClass + '" data-toggle="dropdown" href="javascript:;">' + xLabel + ' <span class="caret"></span></a><ul class="dropdown-menu"></ul><input type="hidden" value="' + $(e).val() + '" name="' + $(e).attr('name') + '" id="' + $(e).attr('id') + '" class="' + $(e).attr('class') + '" />');

            $(":checkbox", this)
            $(e).find('option').each(function(o,q) {
                    select.find('.dropdown-menu').append('<li><a href="javascript:;" data-title="'+ $(q).text() +'" data-value="' + $(q).attr('value') + '">' + $(q).text() + '</a></li>');
                    if ($(q).attr('selected')) select.find('.dropdown-menu li:eq(' + o + ')').click();
            });
            select.find('.dropdown-menu a').click(function() {
                    select.find('input[type=hidden]').live().val($(this).data('value')).change();
                    select.find('.btn:eq(0)').html($(this).text() + ' <span class="caret"></span>');
            });
        }
    });

如果有人可以提供帮助,我会感激

1 个答案:

答案 0 :(得分:6)

您可以使用this JavaScript plugin。它会隐藏select并在HTML中添加一个下拉按钮。

对我来说非常好。我在IE8上测试过它可以工作。