缩短选择选项列表中的选定选项

Question

如何使用jQuery / JS缩短select中的文本？例如，在下面的选择中我想只显示字母'G'：

与：Shorten long options in a select options list相反，我想缩短所选文本而不是缩短弹出列表中的所有选项。

更新（问题来源）：

我发现了问题所在。 SELECT元素（在图中）位于表的页脚TH中，其中word-wrap:break-word;。所以这个选项继承自TH。

所以最后我选择了正常包装的Volkan Ulukut解决方案：

<select id="currencies" name="currencies" style="max-width:35px; word-wrap: normal;">

Answer 1

我不确定我是否正确理解你想要做什么，但是如果你想直接缩短选项的文字，这就是你可以做的：

$('#your-select option').text(function (i, text) {
    return text[0]; //shorten text to the first letter
});

如果您只是想直观地更改它，可以使用max-width在您的选择元素上添加特定宽度。

Answer 2

这将是一个css解决方案，但在selectbox中添加max-width应该可以解决问题：

 <select id="currencies" name="currencies" style="max-width:35px;">
  <option value=gs>GBP</option>
 </select>

jsfiddle

如果你坚持使用jquery：

$("#currencies").css("max-width","35px");