Html 无法使固定操作按钮在Materialize CSS中工作

我正在youtube上学习MaterializeCSS教程，并按照它的说明创建一个FAB。但是，当我滚动到按钮时，图标不会出现。我不知道为什么会这样

我环顾了一下互联网，还没有找到解决这个问题的办法。jQuery可能有问题，但我已经从Materialize网站复制并粘贴了HTML设置代码

编辑模式

插入图表
引用格式
发表
附加文件

您需要包括materialize css和js。请尝试以下代码：

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>


<script type="text/javascript">
    $(document).ready(function(){
    $('.fixed-action-btn').floatingActionButton();
  });
</script>

$（文档）.ready（函数（）{
$（'.fixed action btn'）.floatingActionButton（）；
});

您需要添加Jquery以调用materialize js，还需要添加materialize css以实现适当的布局和设计，并添加FAB操作的调用函数

$（文档）.ready（函数（）{
$（'.fixed action btn'）.floatingActionButton（）；
});

编辑模式

插入图表
引用格式
发表
附加文件

Materialize不再依赖JQuery，您正在使用1.0.0，因此需要添加以下js函数。看

添加类似JSFIDLE的代码
document.addEventListener('DOMContentLoaded', function() {
  var elems = document.querySelectorAll('.fixed-action-btn');
  var instances = M.FloatingActionButton.init(elems, {
    direction: 'top'
  });
});