Materialize CSS Modal-输入问题

Question

我正在尝试实现一个包含来自第一个模态的输入类型文本的模态，但是一旦触发了第二个模态，输入字段就会被停用。谁知道我该怎么解决？

请在下面的Jsfiddle链接中找到示例：Modals

<div id="modal2" class="modal">
<div class="modal-content">
  <h4>Modal Header</h4>
  <p>A bunch of text</p>
  <input type=text/>
</div>
<div class="modal-footer">
  <a href="#!" class="modal-close waves-effect waves-green btn-flat">Agree</a>
</div>
 </div>
  <div id="modal1" class="modal">
     <div class="modal-content">
       <h4>Modal Header</h4>
        <p>A bunch of text</p>
        <a class="waves-effect waves-light btn modal-trigger" href="#modal2">Modal</a>
   </div>
  <div class="modal-footer">
       <a href="#!" class="modal-close waves-effect waves-green btn-flat">Agree</a>
   </div>
  </div>
  <a class="waves-effect waves-light btn modal-trigger" href="#modal1">Modal</a>


 <script>
   $(document).ready(function () {
       $('.modal').modal();
   });
 </script>

Answer 1

我认为问题是您使用的版本，最快的解决方案是更改版本

来自

<!-- 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>

收件人

<!-- Compiled and minified CSS -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<!-- Compiled and minified JavaScript -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>