问题
I am using Semantic UI Dropdown in my ASP.NET Web Forms application. Its working fine in this fiddle. But in my application it is not showing the drop down when clicked on the selector div. Also, I can select the elements by searching but in that case too the drop down is not showing. When I inspected using Firefox, I found that display: none property is not changing for .menu class. When I researched on SO, I found these related questions: Semantic-ui dropdown is not working and semantic UI dropdown not working. I tried the solutions but none of them seem to work. I checked other css in my project none of them shows any conflict. Then, what is wrong with it? You can find my dropdown code in the fiddle.
回答1:
Sometimes you'll have to initialize the JS part of semantic.
Try calling the .dropdown() function in the .onLoad() of the window.
window.onload = function(){
$('.ui.dropdown').dropdown();
};
回答2:
You cant use multiple menu classes !! . Just read the doc : http://semantic-ui.com/modules/dropdown.html . I edit your fiddle, and it works now:
<div id="itdd" class="ui dropdown search button" style="background:maroon; color:white">
<span class="text">Click to select</span>
<div class="menu">
<div class="item" data-value="1"><i class="fa fa-rupee"></i> Currency</div>
<div class="item" data-value="2"><i class="fa fa-rupee"></i> Currency</div>
<div class="item" data-value="3"><i class="fa fa-rupee"></i> Currency</div>
<div class="item" data-value="1"><i class="fa fa-rupee"></i> Currency</div>
<div class="item" data-value="1"><i class="fa fa-rupee"></i> Currency</div>
<div class="item" data-value="1"><i class="fa fa-rupee"></i> Currency</div>
</div>
Here: http://jsfiddle.net/ow2by6av/7/
回答3:
In my case, I had minchars set greater than 1. Clicking on the dropdown does not render the menu in that case.
来源：https://stackoverflow.com/questions/30551424/semantic-ui-dropdown-is-not-showing-the-drop-down-but-everything-else-is-working