Javascript 设置或替换标准选择元素的样式

我做了很多搜索，似乎找不到我认为可能是一个相当直截了当的问题的答案

我想在我的页面上设置一个选择，使它基本上是一个绿色的正方形，在中间显示白色的1—20个数字。< /P> 以下是我到目前为止的情况：

select
{
    width: 1.2em;
    height: 1.5em;
    background-color: #3CB23C;
    -moz-border-radius: 0.2em;
    border-radius: 0.2em;
    border: 0.06em outset #666;

    text-align: center;
    color: #fff;
    font-weight: bold;
    font-size: 4em;
}

到目前为止，它看起来还不错，但我找不到任何关于如何删除箭头的信息，以便使它看起来像一个带有数字的普通框

在我收到一千封关于我为什么不应该这样做的回复之前。。。我知道。我以前都读过！！我不是要你告诉我该不该我是问我该怎么做！它适用于移动应用程序，通过点击绿色框，然后从结果列表中选择号码，即可选择号码。这将是显而易见的框做什么，所以没有必要进入一个无障碍对话这里请

我读过很多关于不能很容易地选择样式和其他表单元素的文章，我也读过很多类似的答案：

您不能自行设置控件的样式，但可以使用JavaScript 隐藏它并创建一个JavaScript函数控件，使其像拖放一样运行 下拉列表。选择项目后，它将在下拉列表中选择该项目 下拉列表

但令人惊讶的是，很少有例子

那么，是否有人有办法设计箭头的样式，使其“消失”，或者如果不能简单地使用CSS来删除箭头，那么有人有没有任何好的例子来说明如何使用Javascript复制这种效果

---

谢谢你

这里有一个小提示，告诉你怎么做。 想法是用欧弗流来隐藏阿罗：隐藏；部门

<style>
div{
    float:left;
    width:90px;
    height:100px;
    overflow:hidden;
}
select
{
    float:left;
    width: 3.2em;
    height: 1.5em;
    background-color: #3CB23C;
    margin-left:-8px;

    text-align: center;
    color: #fff;
    font-weight: bold;
    font-size: 4em;
}
</style>
<div>
    <select>
        <optgroup label="Server-side languages">
        <option>21</option>
        <option>22</option>
        </optgroup>
        <optgroup label="Client-side languages">
        <option>23</option>
        <option>25</option>
        </optgroup>
    </select>
</div>

---

在wekbit浏览器中，您可以使用：

select {
  -webkit-appearance: none;
}

它在ie或firefox中不起作用，即使是-moz外观：无；或外观：无

---

但依我看，最好这样做：为自定义元素设置样式并使用jQuery设置动画。然后添加一个隐藏的select，该select使用上面的元素填充jQuery。它稍微长一点，但这样你就不会有那么多浏览器兼容性问题。

@pinouchon的答案对于如何删除箭头是正确的。如果您对下拉部件的默认样式满意，那么您可以节省大量的工作—键盘使用、可访问性问题、跨平台行为、鼠标向下vs.单击vs.单击并按住

但是，尽管您可以使用-webkit-appearance/-moz-appearance覆盖最初显示的零件的样式，但似乎没有任何方法可以重新设置下拉零件的样式。在这种情况下，您需要使用JavaScript和插入的HTML元素创建一个假选择菜单，并希望涵盖上述所有用例

---

我们的团队已经开始使用后一种方法的一个例子是。

如果您想要一个例子，请查看jQuery mobile.nice one Sime。发现这个：你指的是Mozilla浏览器：P。当然，它是webkit中的webkit外观。噢，哇，很好。虽然有一个-moz的外观，但正如一些在JSFIDLE中玩的人所显示的那样，它不起作用！悲伤时光。为自定义元素设置样式并使用jQuery设置动画。-这太棒了，我非常乐意使用Javascript来完成它，程序的其余部分无论如何都是js的，所以再多一点也不会有什么坏处！但我真的很想知道如何做到这一点的例子/教程。你知道我在哪里能找到吗？