选择框元素和：之后

Question

为什么它不起作用？如果没有添加额外元素，是否有解决方法？

http://jsfiddle.net/86gb2/

Answer 1

在你的小提琴中，以下声明可能没有达到你所期望的效果。

select:after {content: "This doesn't work";}

这实际上会在选择框的内容 之后附加文本 ，而不是在选择框本身之后。因此，在标记中的最后一个option之后添加文本。 （当然这既不是有效的，也不会由浏览器呈现。）

换句话说，如果你有这个标记：

<a href="#">My link</a>

和这个CSS：

a:after {content: " has now been appended to";}

实际发生的是：

<a href="#">My link has now been appended to</a>

Answer 2

我建议使用jQuery API来处理这些事情：

$(document).ready(function(){
    $("select").after("<div>this doesnt work, or does it?</div>");
});​