Bootstrap模式在页面加载时自动打开，但如果表单已提交，如何禁用

Question

我有一个时事通讯模式设置，它运行良好。我已经设置为通过一些javascript代码在页面加载时自动启动它，但如果你成功地在模态中提交了表单，我怎么能让它不打开呢？

Javascript：

<script type="text/javascript">
$(window).on('load', function() {
$('#newsletter-modal').modal('show');
});
</script>

HTML模式代码：

<div class="modal fade" id="newsletter-modal">
<div class="modal-dialog modal-lg">
<div class="modal-content primary-modal">
<div class="modal-header">
<h4 class="modal-title"><i class="fas fa-envelope-open-text primary-modal-icon"></i> Subscribe to our Newsletter</h4>
<button type="button" class="close" data-dismiss="modal" aria-label="Close" style="color: #fff;">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body primary-modal-body">
<form method="post" action="">
<div class="col-sm-12">
<div class="form-group col-md-6 col-md-offset-3 primary-modal-form">
<label class="justify-content-center" style="color: rgba(255,255,255,.55); text-align: center;">Your Name</label>
<input type="text" class="form-control" placeholder="John Doe" name="newsletter_name">
</div>
</div>
<div class="col-sm-12">
<div class="form-group col-md-6 col-md-offset-3 primary-modal-form">
<label style="color: rgba(255,255,255,.55); text-align: center;">Your Email</label>
<input type="email" class="form-control" placeholder="[e-mail]" name="newsletter_email">
</div>
</div>
<div class="modal-footer justify-content-between">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-default swalDefaultSuccess" name="signup_newsletter">Subscribe <i class="fas fa-arrow-circle-right primary-modal-subscribe-icon"></i></button>
</div>
</form>
</div>
</div>
</div>
</div>

Answer 1

检查一下它会帮助你：

使用jQuery Cookie解除引导模式(永远！(，点击

Answer 2

通过在PHP中这样做，可以防止人们在"客户端"JS中捣乱。

此外，您只能在订阅有效的情况下设置cookie，即在您验证了电子邮件等之后。

在页面上PHP

if (isset($_POST['newsletter_email'])) {
//you subscribe stuff here
$_SESSION['subscribed']=true;
}

然后在中包装您的modal js

if (!isset($_SESSION['subscribed']))  {
///output your onload js.
}