我编写了一个带<select>
ID的函数,并用新的选项替换所有选项(使用jQuery的html()
)。但是,在IE上,下拉列表的宽度仍然是原始的,其大小比我需要显示的大,因为它基于具有长字符串标题的原始<option>
。
有没有办法迫使<select>
重新计算它的宽度?
我正在使用IE 8。
答案 0 :(得分:2)
我认为实用的解决方案是替换整个<select>
元素。这样,新插入的元素将具有其<option>
元素的正确宽度(忽略可能应用的任何其他样式)。
如果替换整个select,要记住的是,在从DOM中删除它之前需要清理对被替换元素的任何引用(以避免任何潜在的内存泄漏)和附加到新插入的事件处理程序元件。
答案 1 :(得分:1)
可以通过css设置其宽度。 在你的情况下,我会使用这种方法来接近它:
如果您使用em或ex作为字体大小单位,那么因为它是基于高度的值,您可以假设使用某个比率,它几乎接近字符宽度的等效值。基于此,您可以实际计算出选择元素的宽度:
1st:从选择选项中获取最小字符串的字符数。 第二:乘以em值。 第3步:将此值设置为选择的宽度。
使用可通过以下方式实现的jquery:
var em = 1em; //assign here a value, that corresponds to your layout's font size
var shortest = 6500;
$('mySelect').each(function(i, selected){
temp = $(selected).text().length();
shortest = (temp < shortest) ? temp : shortest;
});
$('mySelect').css('width',(shortest*em + 1) + 'em'); //add 1em for the scrollbar