下拉按钮 - materializecss 框架答案

【问题标题】：Dropdown button - materializecss framework下拉按钮 - materializecss 框架
【发布时间】：2016-11-01 07:56:48
【问题描述】：

我正在尝试制作一个下拉按钮，但它无法正常工作，因为该按钮在移动设备上工作，但在桌面上却不行。这是代码：

init.js

  (function($){
  $(function(){

    $('.button-collapse').sideNav();
    $('select').material_select();
    $('.dropdown-button').dropdown();

  }); // end of document ready
})(jQuery); // end of JQuery name space

html代码

<ul id="dropdown2" class="dropdown-content">
    <li><a href="#">Ustawienia</a></li>
    <?php if($this->session->userdata('u_group') > 1) { ?>
    <li><a href="#">Panel administratora</a>
 </li>
    <?php } ?>
</ul>

<li><a class="dropdown-button" href="#!" data-activates="dropdown2"><?php echo $this->session->userdata('u_nick'); ?><i class="material-icons right">arrow_drop_down</i></a></li>

【问题讨论】：

检查你的导入，jQuery必须在materialize.js之前导入
不是这样......

标签： html css materialize

【解决方案1】：

我认为您需要将btn 类添加到具有dropdown-button 类的标签中。然后它会工作。 这里是codepen

HTML

<ul id="dropdown2" class="dropdown-content">
  <li><a href="#">Ustawienia</a></li>
  <li><a href="#">Panel administratora</a></li>
</ul>

<li> <!-- Add btn class to a tag -->
  <a class="dropdown-button btn" href="#!" data-activates="dropdown2">Dropdown
    <i class="material-icons right">arrow_drop_down</i>
  </a>
</li>

【讨论】：