Question

这是我第一次在这里提问，因为我无法找到问题的答案。我正在使用materialize并尝试使用material_select（）。这是我的主页面，其中包含jQuery和materialize库以及对document.ready和sidenav()的{{1}}调用。 Sidenav工作正常，但material_select()正在抛出一个未捕获的TypeError。

material_select()

这是我使用select的html：

<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>

这是我得到的错误：

未捕获的TypeError：$（...）。material_select不是函数
  在HTMLDocument。$。ready（仪表板：80）
  在mightThrow（jquery-3.2.1.js：3583）
  在过程中（jquery-3.2.1.js：3651）

Answer 1

根据{{3}}

，如果我没有错误，那么formSelect()应该是material_select()，而不是1.0.0

＆＃13;

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

＆＃13;

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>

＆＃13;

Answer 2

试试吧和我合作我使用materialize 1.0.0-beta

document.addEventListener('DOMContentLoaded', function() {
   var elems = document.querySelectorAll('select');
   var options = document.querySelectorAll('option');
   var instances = M.FormSelect.init(elems, options); })

Answer 3

在脚本部分中使用以下内容

$(document).ready(function() {
$('.mdb-select').materialSelect();
});

Materialize material_select不是函数错误

3 个答案: