Question

我正在寻找解决我在Internet Explorer（6,7＆amp; 8）中遇到的问题的最简单的解决方案，无论是CSS还是使用jQuery。我有一个定义宽度的SELECT输入（因为它在布局中的位置）。由于定义的宽度选择与显示其完整值不同，与Firefox＆amp; Safari自动调整大小以显示值的整个长度..

当然这是一个常见的问题？有什么想法吗？

示例代码：

<select id="Grouping_662066" class="productSelectInput" name="AddToCart_Grouping" onchange="DrawProduct(36331,662066,this.value,'',true);">
</select>

我正在使用CMS系统，“productSelectInput”类是整个网站所包含的唯一标识符。 ID，name和onchange属性将发生变化。

Answer 1

Here是使用jQuery的信息和解决方案。

Answer 2

考虑到这些限制，我唯一可以为IE建议的是减少字体的大小。

我不确定是否有其他办法。

Answer 3

你可以使用常规的Javacsript，利用onmousedown，onblur和onchange函数来操作元素CSS。以下是jQuery中解决方案的外观（使用相同的函数）。

    var example = $('#some-id');

    $(example).mousedown(function() {
            $(this).css('width','400px');                            
    });
    $(example).blur(function({
            $(this).css('width','200px');                            
    });
    $(example).change(function() {
            $(this).css('width','200px');                            
    });

Answer 4

就我而言，这是一个浏览器问题（IE）。

您可以加入＆amp; nbsp;包含选项或使用Javascript在焦点和模糊事件上动态调整选择。此外，您可以创建一个带有css和javascript的下拉菜单（没有'select'，但是'ul'）并且可以完全控制界面。（onBlur，javascript应该在隐藏输入上写一个值）。

Answer 5

如果ie8支持伪类：焦点，您可以为单击选择时指定更大的宽度。虽然不会在ie6中工作，也可能不是ie7

IE输入选择框

5 个答案: