防止submit表单多次提交

版权声明：经验之谈，不知能否换包辣条，另，转载请注明出处。 https://blog.csdn.net/zhezhebie/article/details/82022982

再提交预约信息的时候，想要点击一次提交之后，将提交按钮置为disabled，做了下面尝试：

<button type="submit" class="btn btn-lg btn-primary" id="submit_once" onclick="getElementById('submit_once).disabled=true">提交</button>

结果是，点击提交按钮之后，的确置为disabled了，但是这时候form表单根本就没有提交，后台收不到数据。

虽想到下面方法，给form表单取个名字

<form class="form-horizontal" action="{{url('student/postAnAppointment')}}" method="post" enctype="multipart/form-data" role="form" name="form1">

然后写一个dosubmit方法，先把提交按钮置为失效，再把form的submit置为disabled，这样就可以了。后台收到数据，前台提交按钮置为不可再次提交，多次点击，效果与预料一致。

<button type="submit" class="btn btn-lg btn-primary" id="submit_once" onclick="dosubmit()">提交</button>

<script type="text/javascript">
  function dosubmit() {
  var btnSubmit = document.getElementById("submit_once");
  //将表单提交按钮设置为不可用，可以避免用户再次点击提交按钮进行提交
  btnSubmit.disabled = "true";
  document.form1.submit();
  }
</script>