如何通过按钮打开选择下拉菜单？
$('button').on('click', function() {
$('select').trigger('click');
});
我的代码：http://jsfiddle.net/UGkWp/
UPDATE:
我找到了针对 webkit 浏览器的解决方案，但只有这些浏览器：http://jsfiddle.net/UGkWp/2/也许您知道如何在每个浏览器中执行此操作？
你可以只用 CSS 来做到这一点，如下所示：
<html>
<body>
<div class="sorting">
<div class="sort right"><label>
<span>Items per page</span>
<select>
<option value="">Items per page</option>
<option value="10">10</option>
<option value="20">20</option>
<option value="40">40</option>
<option value="60">60</option>
<option value="100">100</option>
<option value="200">200</option>
</select>
<span class="pointer"><i class="fa fa-caret-down"></i></span>
</label>
</div>
</div>
</body>
</html>
<style>
select{
-webkit-appearance:none;
appearance:none;
-moz-appearance:none;
}
.sorting{
padding:5px 10px;
border:1px solid #eee;
clear:both;
background:#FFF;
height:40px;
}
.sorting h4{
padding:4px 0 0;
margin:0;
}
.sort{
position:relative;
padding-left:10px;
float:left;
}
.sort>label{
font-weight:normal !important
}
.sort span.pointer{
height:30px;
width:30px;
border-left:1px solid #ddd;
position:absolute;
right:0;
top:0;
text-align:center;
color:#c49633;
font-size:20px;
z-index:1;
}
.sort span.pointer i{
margin-top:6px;
}
.sorting select{
padding:5px 40px 5px 10px !important;
margin-left:10px;
border:1px solid #eee;
background:none;
height:30px;
position:relative;
z-index:2;
}
</style>
访问此小提琴了解更多详细信息：https://jsfiddle.net/ssjuma/1mkxw2nb/1/
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
