自動展開<select>標記寬度代表字符長度 - Javascript

Question

我要展開<select>標記寬度代表字符長度<option>標記。

目前，我使用的這個例子：http://jsfiddle.net/rathoreahsan/ShgWt/但對字符數的基礎定義硬編碼的寬度，它適用於所有新的瀏覽器，除了小於IE 9

但是我通過使用jQuery想要一個更好的解決方案/自動寬度代替硬​​編碼寬度代表字符數。

---

其實我有動態的繪製列表。但我有一個固定的寬度爲最初在網頁上的所有下拉列表，我想在標記的字符長度基礎上更改onchange行爲

請幫忙。

在此先感謝。

Answer 1

你在這裏。這假定div test使用與選擇框相同的字體。基本上我把文本轉儲到一個div，測量div寬度，並清除div。然後我將該寬度分配給選擇框。

工作小提琴：http://jsfiddle.net/Jaybles/ShgWt/5/

HTML

<!--Add right before </body> tag --> 
<div id='test'></div> 

JS

function countit(what){ 
    var formcontent = what.form.charcount.value; 
    var t = $('#test'); 
    t.html(formcontent); 
    var w = t.width() + 25; 
    t.html(''); 
    $("#selectBox").css ({'width' : w + "px"}); 
} 

CSS

#test{float:right;} 
#selectBox{width:80px;} 

Answer 2

難道你不能通過在<select>中根本沒有指定任何寬度來完成這個任務嗎？如果我正確自動展開是非指定寬度選擇的默認行爲。