无法 select materializecss 中的选项 select

Unable to select options in materializecss select

我在 materializecss 的 select 元素中遇到问题。

在我的玉档里

//Stylesheets
        link(rel='stylesheet', href='https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.2/css/materialize.min.css' )

//Vendor Scripts
        script(src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js')
        script(src='https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.2/js/materialize.min.js')

在我的控制器中,我将组件初始化为

$('select').material_select();

在我的 HTML 中,我使用的是

<label>Materialize Select</label>
<select>
   <option value="" disabled selected>Choose your option</option>
   <option value="1">Option 1</option>
   <option value="2">Option 2</option>
   <option value="3">Option 3</option>
</select>

然而,当我尝试 select 选项时,没有任何反应。

下面是初始化后的显示

生成的

HTMl 如下所示

<div class="col s4 input-field">
   <div class="select-wrapper">
      <span class="caret">▼</span><input type="text" class="select-dropdown" readonly="true" data-activates="select-options-b9fd5517-0d0d-40ff-ab29-d37fc9a8d05f" value="Choose your option">
      <select class="initialized">
         <option value="" disabled="" selected="">Choose your option</option>
         <option value="1">Option 1</option>
         <option value="2">Option 2</option>
         <option value="3">Option 3</option>
      </select>
   </div>
</div>

如您所见,未生成 ul 元素,它是在初始化后生成的。

这里有什么问题的线索。

你的javascript是不是这个样子..

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

..你的HTML喜欢这样吗?

<html>
    <head>
      <!--Import materialize.css-->
      <link type="text/css" rel="stylesheet" href="css/materialize.min.css"  media="screen,projection"/>
    </head>

    <body>
      <!--Import jQuery before materialize.js-->
      <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
      <script type="text/javascript" src="js/materialize.min.js"></script>
    </body>
  </html>

0.97.2 版本存在一些问题

见下文

https://github.com/Dogfalo/materialize/issues/2265