模态关闭提交

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')

1. Bootstrap需要一个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>