我正在尝试使用插件登录表单，其中电子邮件和密码是两个字段。尽管我有根据数据库中存储的数据验证电子邮件和密码的代码，但只要单击提交按钮，modal就会在没有验证的情况下关闭。在输入有效的电子邮件和密码或单击取消按钮之前，我不想退出模式。标记如下：
<!Doctype = html>
<head>
meta data entered
</head>
<body>
<div class="modal-content">
<div class="modal-header">
<h1>Sign In</h1>
</div>
<div class="modal-content">
<form>
<input name="email" type="email">
<input name="password" type="password">
<button type="submit">Submit</button>
</form>
</div>
<div class="modal-footer">
</div>
</div>
有人能帮忙吗？感谢
实现这一点的一种方法是"捕获点击事件"，阻止默认操作并从那里执行。
<script>
$('button[type="submit"]').click(function(event){
event.preventDefault();
$.ajax({
success: function(data, status, xhr) {
$('#modal-div').modal('close');
},
url: ...,
type: ...,
})
})
您需要向PHP脚本发出AJAX请求，该脚本可以从MySQL或其他任何地方验证您的凭据。如果登录顺利，该脚本应该返回HTTP头200，否则返回401。这个HTTP请求还应该返回一个带有"OK"或类似内容的主体(而不是<body>)，这样就可以很容易地检查AJAX请求的成功处理程序中的一切是否正常。成功处理程序(回调)也是关闭模态的合适位置。
研究我的答案中你不理解的任何内容。阅读以下主题的介绍材料。当你对这些概念有了足够的理解后，用你写的代码更新你的问题。解释你为什么认为代码应该工作，并概述你为什么认为它不工作的想法。这样，你就会在这个网站上得到帮助
- HTTP状态代码
- PHP HTTP标头
- PHP HTTP响应
- 为什么javascript是异步的
- 成功回调
- jQuery ajax请求