html - 让基本的物化 CSS 下拉菜单正常工作

Question

我正在尝试使用物化 CSS 下拉列表，但我无法使物化版本正常工作。

这是他们的例子(我有这个是因为它需要我有一个代码示例来发布):

  <div class="input-field col s12">
    <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>
    <label>Materialize Select</label>
  </div>

这是我正在尝试开始工作的示例的 fiddle ，第一个是使用浏览器默认值的下拉列表，第二个来自引用:

https://jsfiddle.net/msq3g0nk/10/

这是文档的链接(选择右侧的“选择”)

http://materializecss.com/forms.html

任何帮助都会很棒。

Answer 1

如文档中所述，您需要初始化下拉菜单。

http://materializecss.com/forms.html#select-initialization

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

工作示例:https://jsfiddle.net/msq3g0nk/11/