動態調整選擇列表的大小（Safari）

我想根據所選索引（字符串）所需的寬度調整選擇列表的大小。舉例來說，我有一個3字符串的列表，簡短，中等，loooooong;我不希望選擇列表自動地像它的最大元素一樣寬，而應該和它所選的元素一樣寬。動態調整選擇列表的大小（Safari）

我試過的第一種方法：document.getElementById('selectList').style.width = (selectedText.length * 6) + 'px';其中selectedText是一個字符串，而6是對字符寬度的一個不好的估計。如果沒有等寬字體，則無法正常工作。

我嘗試的下一個方法是將offscreen div（top：-9999px）的innerHTML設置爲所選索引，然後：document.getElementById('selectList').style.width = document.getElementById('hiddenDiv').offsetWidth; 此方法的問題在於寬度也不正確，與實際選擇的字符串相比，長字符串使選擇列表的路線變長。

任何想法如何根據字符串寬度/長度動態調整此選擇列表的大小？

來源

2010-08-05 sgarman

你想要的元素來改變它的寬度，在同一行意味着一切，右邊會跳來跳去，或者只是下拉部分？ – 2010-08-06 01:16:59

您可以在更改時使用所選選項值填充隱藏跨度，獲取其寬度，然後將選擇列表設置爲該寬度。

Demo

來源

2010-08-05 21:06:57 cnanney

我剛剛意識到我使用jQuery進行演示，並且沒有提到問題中的jQuery。所以，如果您使用jQuery，有一種方法可以實現它:) – cnanney 2010-08-05 21:09:32

如果您實際上將您的方法轉換爲javascript，則不起作用。 jQuery做了一些神奇的工作，並且在查看了jQuery源代碼後，我無法確認它是如何實現它的。您無法獲得javascript中隱藏跨度的CSS寬度，我認爲您需要獲取其clientHeight。 – sgarman 2010-08-06 17:58:26

動態調整選擇列表的大小（Safari）

回答

相關問題