我有一个 Bootstrap 模态,当窗口加载时模态加载。现在,我希望如果用户不填写详细信息,则模态不会关闭,但如果用户填写详细信息并单击提交按钮,模态应该关闭。那么,我该怎么做呢?请帮助我。
<script>
$(document).ready(function(){
$(window).on('load',function(){
$('#myModal').modal('show');
});
});
</script>
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content" style="border-radius: 0px;">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h3 class="modal-title">Header</h3>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-12">
<input type="text" name="names" id="names" class="form-control1" placeholder="Name *" required>
<input type="text" name="emails" id="emails" class="form-control1" placeholder="Email *" required>
<input type="text" name="contacts" id="contacts" class="form-control1" placeholder="Contact *" required>
<textarea name="address" id="address" class="form-control1" placeholder="Address *" cols="10" rows="5" style="width:100%;margin-bottom: 1em;" required></textarea>
<input type="submit" name="insert" id="insert" value="Submit">
</div>
</div>
</div>
</div>
</div>
</div>
最佳答案
$(document).ready(function(){
$("#myModal").modal({
backdrop: 'static',
keyboard: false
});
$('#myModal').modal('show');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" rel="stylesheet"/>
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content" style="border-radius: 0px;">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h3 class="modal-title">Header</h3>
</div>
<div class="modal-body">
<form method="POST" action="#">
<div class="row">
<div class="col-md-12">
<input type="text" name="names" id="names" class="form-control1" placeholder="Name *" required>
<input type="email" name="emails" id="emails" class="form-control1" placeholder="Email *" required>
<input type="text" name="contacts" id="contacts" class="form-control1" placeholder="Contact *" required>
<textarea name="address" id="address" class="form-control1" placeholder="Address *" cols="10" rows="5" style="width:100%;margin-bottom: 1em;" required></textarea>
<input type="submit" name="insert" id="insert" value="Submit">
</div>
</div>
</form>
</div>
</div>
</div>
</div>
检查代码我希望你想要这样的东西。
关于php - 如何在不填写详细信息模式的情况下禁用用户不关闭?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54068929/