很抱歉问了一个愚蠢的问题。但是我对 JS 的了解很差。我不知道如何使用 JS 初始化物化组件，但使用 jquery 效果很好。例如我想使用可折叠组件。 http://next.materializecss.com/collapsible.html
<ul class="collapsible">
<li>
<div class="collapsible-header"><i class="material-icons">filter_drama</i>First</div>
<div class="collapsible-body"><span>Lorem ipsum dolor sit amet.</span></div>
</li>
<li>
<div class="collapsible-header"><i class="material-icons">place</i>Second</div>
<div class="collapsible-body"><span>Lorem ipsum dolor sit amet.</span></div>
</li>
<li>
<div class="collapsible-header"><i class="material-icons">whatshot</i>Third</div>
<div class="collapsible-body"><span>Lorem ipsum dolor sit amet.</span></div>
</li>
</ul>
并用于初始化
// JS
var elem = document.querySelector('.collapsible');
var instance = new M.Collapsible(elem, options);
// Or with jQuery
$(document).ready(function(){
$('.collapsible').collapsible();
});
最佳答案
试试这个:
<!DOCTYPE>
<html>
<head>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-alpha.1/css/materialize.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-alpha.1/js/materialize.min.js"></script>
</head>
<script>
var elem = document.querySelector('.collapsible');
var instance = new M.Collapsible(elem, {
// inDuration: 1000,
// outDuration: 1000
});
</script>
<body>
<ul class="collapsible">
<li>
<div class="collapsible-header"><i class="material-icons">filter_drama</i>First</div>
<div class="collapsible-body"><span>Lorem ipsum dolor sit amet.</span></div>
</li>
<li>
<div class="collapsible-header"><i class="material-icons">place</i>Second</div>
<div class="collapsible-body"><span>Lorem ipsum dolor sit amet.</span></div>
</li>
<li>
<div class="collapsible-header"><i class="material-icons">whatshot</i>Third</div>
<div class="collapsible-body"><span>Lorem ipsum dolor sit amet.</span></div>
</li>
</ul>
</body>
</html>
在这里检查工作代码笔:https://codepen.io/Astha25/pen/OzJpbQ
关于javascript - 如何在 materialize 1.0 中初始化 javascript，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47765395/