时间戳

首页 > 解决方案 > 使用 Materialise CSS 模式进行 PHP 登录

php - 使用 Materialise CSS 模式进行 PHP 登录

问题描述

我已经使用 PHP 构建了一个登录系统，并使用 Materialize CSS 对其进行了样式设置。对于登录，我使用的是弹出模式。登录工作正常，但如果登录尝试失败，我想停止关闭并显示我的错误消息。PHP错误消息正确弹出，但每次都关闭模式。如果我重新点击它，我可以看到错误消息 - 但是 - 我需要关闭停止，除非他们点击“关闭”或登录/重定向成功。非常感谢您对此的任何帮助。

标签： phploginmaterialize

解决方案

您必须使用提供的选项。使用dismissible false，然后手动关闭它。我使用了 jquery，但您也可以不使用 jquery，如注释行之间所示

/*document.addEventListener('DOMContentLoaded', function() {
    var elems = document.querySelectorAll('.modal');
    options = [{
    'dismissible': false,
    }];
    var instances = M.Modal.init(elems, options);
  });
*/
 $(document).ready(function(){
    $('.modal').modal({'dismissible': false});
  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/css/materialize.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/js/materialize.min.js"></script>
<!-- Modal Trigger -->
  <a class="waves-effect waves-light btn modal-trigger" href="#modal1">Modal</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-close waves-effect waves-green btn-flat">Agree</a>
    </div>
  </div>

推荐阅读