MaterialiseCSS组件缺少重要信息

Question

我一直在努力让MaterializeCSS元素在我的项目中正常工作。没有JS功能可以工作，我不确定原因。

这是我的JSFiddle无效。

据我所知，它是this one的精确复制品。那么缺少什么？

$( document ).ready(function() {
      $('.modal').modal();
      $('#modal1').on('click', function() {
      });
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.1/js/materialize.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.1/css/materialize.min.css" rel="stylesheet"/>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<a class="waves-effect waves-light btn view" data-target="modal1">View Scores</a>
<!-- Modal Structure -->
<div id="modal1" class="modal">
  <div class="modal-content">
    <h4>Modal Header</h4>
    <p>A bunch of text</p>
  </div>
  <div class="modal-footer">
    <a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">Agree</a>
  </div>
</div>

由于

Answer 1

问题：@FXML private HBox header; @FXML private HeaderController headerController; 需要materialize所以您需要先导入jquery jquery

materialize.js

$( document ).ready(function() {
      $('.modal').modal();
      $('#modal1').on('click', function() {
      });
    });