无法在选择框中点击图标三角形

我已经使用Jquery完成了自定义选择。我已经把一个三角形FontAwesome图标向右侧漂浮。问题是当我尝试点击图标时鼠标指针不让我点击。该图标占用的空间不能被点击。我不知道我怎么能解决这个问题，或者如果可能与CSS。无法在选择框中点击图标三角形

这是我的代码

$(function() { 
 
    $('select').selectmenu(); 
 
});

.main-search-results:after { 
 
    content: "\f0dd"; 
 
    font-family: 'FontAwesome'; 
 
    padding-left: 4%; 
 
    border-left: 1px solid $text-color; 
 
    position: absolute; 
 
    top: 4px; 
 
    right: 15px; 
 
    z-index: 5; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script> 
 

 
<div class="main-search-results"> 
 
    <select name="" id="select-filter-1"> 
 
    <option value="default">Cualquier provincia</option> 
 
    <option value="a_coruña">A Coruña</option> 
 
    </select> 
 
</div>

来源

2015-07-09 David Soler

在这里你去，

我创建捣鼓你，看看我做了什么在这里..

http://jsfiddle.net/mkdizajn/jsxuvkn6/

.w{ 
    position:relative; 
} 
.ui-selectmenu-button::after { 
    content: "\f0dd"; 
    font-family: 'FontAwesome'; 
    position: absolute; 
    top: 5px; 
    right: 15px; 
    width: 20px; 
    height: 20px; 
} 
.ui-icon{ 
    display:none; 
}

我附着到生成jQueryUI的项目的图标FA ..
移除（显示：无）的初始下拉

我现在可以点击该三角形,,测试，以查看是否适用于你

hth，k

来源

2015-07-09 23:51:48

oserk在这种情况下，'w'是什么？这是我想要的，但我不知道'w'是什么 –

我认为这个小提琴是你需要的，http://wp.jsfiddle.net/mkdizajn/jsxuvkn6/1/ w只是作为包装的那个元素,,我不认为这是需要了，我首先想到的是需要定位元素..嘿，我不能再现你的问题,,整个按钮是可点击的权利？ –

伟大的回答奥斯卡。它现在正在完善。我想我需要删除z索引属性。非常感谢你的帮助 –

无法在选择框中点击图标三角形

回答

相关问题