隐藏默认选择IE9中的下拉箭头

Question

DEMO

我试过css appearance: none;来隐藏选择下拉箭头.但在IE9箭头显示.供参考,请参阅图像.

知道如何使用css或jquery隐藏箭头吗？

这是我的代码:

    .fields-set select{
height:32px;
border:1px solid #ccc;
margin: 0 19px 0 1%;
padding:0 32px 0 1%;
width:55%;
float: left;
overflow: hidden;
background:url("https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcR3xT6PSVebCcTYjggESCb55GBM91fGgbyrMFbs3CGeFoQjFwVB") no-repeat scroll right center padding-box border-box #FFF;
box-shadow: none;
-webkit-appearance: none;
   -moz-appearance: none;
        appearance: none;
    -ms-appearance: none  \9;
     -o-appearance: none;
    }

Answer 1

您可以在IE中使用伪元素作为下拉箭头.

select::-ms-expand {
    display: none;
}

参考

• https://msdn.microsoft.com/en-us/library/windows/apps/hh465742.aspx
• 选择删除下拉箭头
• 删除IE上的选择箭头