web-dev-qa-db-ja.com

material_material_selectは関数エラーではありません

私は私の問題に対する答えを見つけることができなかったので、ここで質問をするのは初めてです。マテリアライズを使用していて、material_select（）を使用しようとしています。ここに、jQueryとマテリアライズライブラリ、および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>
_

これは私が得ているエラーです：

不明なTypeError：$（...）。material_selectは関数ではありません
at HTMLDocument。$。ready（ダッシュボード：80）
mightThrow（jquery-3.2.1.js：3583）
プロセス（jquery-3.2.1.js：3651）

javascriptjqueryhtmlcssmaterialize
6
KaneJM

Docs に従って間違っていない場合は1.0.0を使用しているため、formSelect()ではなくmaterial_select()である必要があります

$(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>
11
Muhammad Omer Aslam

マテリアライズ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); })
1
Artur Todeschini