3

我有一些 JS 代码将所有 HTML 下拉列表转换为引导下拉列表：

jQuery(function($){
    $('#primary').each(function(i, e) {
        if (!($(e).data('convert') == 'no')) {
            $(e).hide().wrap('<div style="display:inline-block;" class="btn-group" id="select-group-' + i + '" />');
            var select = $('#select-group-' + i);
            var current = ($(e).val()) ? $(e).val(): 'Category';

            select.html('<input type="hidden" value="' + $(e).val() + '" name="' + $(e).attr('name') + '" id="' + $(e).attr('id') + '" class="' + $(e).attr('class') + '" /><a data-toggle="dropdown" style="border-radius:4px 0px 0px 4px; margin-right:0px;" class="btn" href="javascript:;">' + current + '</a><a class="btn dropdown-toggle" data-toggle="dropdown" href="javascript:;"><span class="caret"></span></a><ul style="max-height:300px; overflow-y:scroll; overflow: -moz-scrollbars-vertical;" class="dropdown-menu"></ul>');

            $(e).find('option').each(function(o,q) {
                if($(q).attr('value') > 0) {
                    if($(q).attr('value') == 30 || $(q).attr('value') == 17 || $(q).attr('value') == 185 ||  $(q).attr('value') == 196 || $(q).attr('value') == 197 ) {
                        select.find('.dropdown-menu').append('<li style="background-color:#FFFACD;"><a href="javascript:;" data-value="' + $(q).attr('value') + '">' + $(q).text() + '</a></li>');
                    } else {
                        select.find('.dropdown-menu').append('<li><a href="javascript:;" 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]').val($(this).data('value')).change();
                select.find('.btn:eq(0)').text($(this).text());
            });
        }
    });
});

我检查了IE控制台，根本没有出现错误...

它在 safari/Chrome 等 Webkit 浏览器中显示良好，但在 IE 中却没有。在 IE (IE 10) 中，下拉列表是空的，如下所示：（在 html 中为空）

在此处输入图像描述

在野生动物园中，它是这样的：

在此处输入图像描述

更新：

经过更多调试，问题就在这里......看起来该行在$(e).find('option').each(function(o,q) {IE 中不起作用，因为里面的所有代码都没有运行。 问题是.find()。我把它改成了.children('option')or .children()，都不能在 IE 中工作。我正在使用 jQuery 1.7.2。

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

1 回答 1

0

检查下拉ul元素并检查lis是否存在，这似乎是一个CSS问题，这在IE上很常见。

尝试为 ul ant 赋予其元素 a float: left; 和一个width。

于 2013-07-31T13:43:55.267 回答