javascript - Materialise material_select is not a function 错误

Question

这是我第一次在这里提问，因为我找不到问题的答案。我正在使用物化并尝试使用 material_select()。这是我的主页，其中包含 jQuery 和 materialize 库以及对 sidenav() 和 material_select() 的 document.ready 调用。 Sidenav 工作正常，但 material_select() 抛出一个 Uncaught TypeError。

<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/js/materialize.min.js"></script>
<script>
$(document).ready(() => {
    $("#slide-out").sidenav();
    $("select").material_select();
});
</script>

这是我使用 select 的 html:

<div class="row">
    <div class="input-field">
        <select name="status" id="selectedTest">
            <option value="public" selected>Public</option>
            <option value="private">Private</option>
            <option value="unpublished">Unpublished</option>
        </select>
        <label for="status">Status</label>
    </div>
</div>

这是我遇到的错误:

Uncaught TypeError: $(...).material_select is not a function
at HTMLDocument.$.ready (dashboard:80)
at mightThrow (jquery-3.2.1.js:3583)
at process (jquery-3.2.1.js:3651)

Answer 1

它应该是 formSelect() 而不是 material_select() 因为你正在使用 1.0.0 如果我没有错根据 Docs

$(document).ready(function() {
  $("#slide-out").sidenav();
  $("#selectedTest").formSelect();
});

Here is the html where I use select:

<div class="row">
  <div class="input-field">
    <select name="status" id="selectedTest">
      <option value="public" selected>Public</option>
      <option value="private">Private</option>
      <option value="unpublished">Unpublished</option>
    </select>
    <label for="status">Status</label>
  </div>
</div>


<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!-- Compiled and minified CSS -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/css/materialize.min.css">

<!-- Compiled and minified JavaScript -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/js/materialize.min.js"></script>