javascript - 如何在下拉列表的选项中定义 span 标签

Question

我正在使用 HAML 创建下拉列表，如下所示:

%select.categories
  %option{:category => 'question'}
    Top Questions in
    %span#topic-name
  %option{:category => 'muse'}
    Top Muses in
    %span#topic-name
  %option{:category => 'user'}
    Top Users in
    %span#topic-name
.clear

我的意图是将主题名称添加到跨度 ID“主题名称”中。但是，当我尝试使用 jQuery $('#topic-name') 查找跨度时，返回了一个空数组。

我检查了生成的 HTML，但看不到定义的 span 标签

谁能告诉我如何创建一个 span 以添加“主题名称”

谢谢

Answer 1

HTML 不能插入选项元素内 - 只能插入文本。您所要求的无法实现。

或者，您可以将主题名称添加为 data-x 参数，尽管这仅在 HTML5 中有效。我不知道如何在 HAML 中实现这一点，但 HTML 看起来像:

<select>
    <option data-topicname="ABC">Top Questions in</option>
</select>