選項標籤

Question

我已經要求出示選擇列表看起來像這樣中突出顯示文本的一部分：

我遇到的問題是如何設置不同的顏色的星號和文本。我試圖用各種內聯HTML標籤包裝星號，但似乎任何HTML都被剝離了。

HTML：

<select id="select-list"> 
    <option value='1'><em>*</em>A value</option> 
    <option value='2'><span>*</span>Another value</option> 
</select> 

輸出呈現的HTML：

$('select-list').select('option').each(function(element) { 
    console.log($(element).innerHTML); 
}); 

*值

*另一值爲

任何人都可以提出一個技術爲了做到這一點？可以使用JavaScript（prototype），但我不想替換select元素。

演示小提琴：http://jsfiddle.net/ejUvt/2/

編輯：我已經考慮去除文本中的星號，並使用背景圖片來代替，但我不知道這將是可訪問的方面是壞事用戶使用屏幕閱讀器和類似的基於文本的設置？進一步在表單中有一條消息說* = required，如果選擇似乎沒有標記星號，那麼會是混淆的嗎？

Answer 1

option標記不能包含HTML標記，根據this W3 spec。裏面只允許有normal character data。

解決方法：使用背景圖像（星號或其他）（位於左側）並將左側填充添加到option元素;儘管這可能適用於所有瀏覽器。