如何調整 Internet Explorer 中的下拉清單寬度？

IE 下拉清單寬度控制

問題：

在Internet Explorer 中），下拉清單會繼承其父下拉框的寬度，當最長的選項選擇器超出下拉框的寬度時，會導致外觀笨重。

解決方案：CSS - 和基於JavaScript 的解決方法

要解決此問題，可以結合使用CSS 和jQuery 為下拉框及其選項列表設定不同的寬度：

$(document).ready(function() {
  $('select.wide')
    .bind('focus mouseover', function() { $(this).addClass('expand').removeClass('clicked'); })
    .bind('click', function() { $(this).toggleClass('clicked'); })
    .bind('mouseout', function() { if (!$(this).hasClass('clicked')) { $(this).removeClass('expand'); }})
    .bind('blur', function() { $(this).removeClass('expand clicked'); });
});

應用以下CSS：

select {
  width: 150px; /* or desired width */
}
select.expand {
  width: auto;
}

將類別「wi​​de」分配給受影響的下拉元素：

<select class="wide">
  ...
</select>

此方法可確保下拉框保留固定寬度，同時允許下拉清單動態擴展，以容納最長的可用選擇器。

以上是如何調整 Internet Explorer 中的下拉清單寬度？的詳細內容。更多資訊請關注PHP中文網其他相關文章！