Question

我有一个模态窗口，当您打开页面时会弹出。提交表单后，我无法关闭它。它会用一个按钮关闭，当您在其外部单击时，却以某种方式无法使用“提交”按钮将其关闭。

我的脚本

var modal = document.getElementById('myModal');



var span = document.getElementsByClassName("close")[0];



span.onclick = function() {
  modal.style.display = "none";
}


window.onclick = function(event) {
  if (event.target == modal) {
    modal.style.display = "none";
  }
}

我想用来关闭模态的按钮。

<input type="submit" name="submit" value="Send" > </form>

Answer 1

使用elem.modal()

$('#myModal').modal('hide')

引导程序需要一个jquery。所以最好使用jquery函数

$(document).ready(function() {
  $('#myModal').modal('show')
  $('form').on('submit', function(e) {
    e.preventDefault();
    $('#myModal').modal('hide')
  })
})

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>

<div class="modal fade" id="myModal" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">Modal Methods</h4>
      </div>
      <div class="modal-body">
       <form>
  <input type="submit" name="submit" value="Send"> </form>
      </div>
    </div>

  </div>
</div>

提交时关闭模式

1 个答案: