页面加载时不能打开的材料化模型

Question

我有最新的实现css和Jquery。当页面完全加载时，我尝试使用模式来发出警告消息。但从来不起作用

<div id="myModal"  class="modal bottom-sheet">
<div class="modal-content">
  <font size="2">Sitemizden en iyi şekilde faydalanabilmeniz için çerezler kullanılmaktadır. Bu siteye giriş yaparak çerez kullanımını kabul etmiş sayılıyorsunuz</font>
</div>
<div class="modal-footer">
  <a href="#!" class="modal-close waves-effect waves-green btn-flat" style="font-size: smaller;margin-top: 0px;height: 30px;">Agree</a>
</div>

​

剧本就是这样，

<script type="text/javascript">
   $(document).ready(function(){
       $('.modal1').modal('open');
    });                             
</script>

如果我用按钮打开模态，它就能工作。那么，CSS和JQuery的工作，你有什么想法吗？

Answer 1

这对我来说很好

​

$(document).ready(function() {
  $('.modal').modal().show();
  $('.modal-close').click(function() {
    $('.modal').hide();
  })
});

<script src="https://cdnjs.cloudflare.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>
<link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css" rel="stylesheet" />


<div id="myModal"  class="modal">

<div class="modal-content">
  <font size="2">Sitemizden en iyi şekilde faydalanabilmeniz için çerezler kullanılmaktadır. Bu siteye giriş yaparak çerez kullanımını kabul etmiş sayılıyorsunuz</font>
</div>
<div class="modal-footer">
  <a href="#!" class="modal-close waves-effect waves-green btn-flat" style="font-size: smaller;margin-top: 0px;height: 30px;">Agree</a>
</div>
</div>

​

Answer 2

您看起来像用id选择器定义了模态，所以我认为您应该像这样使用模态函数：

$('#myModal').modal('open');