bootstrap 表单验证提交自动刷新怎么解决

bootstrap 表单验证提交自动刷新怎么解决，

我想点击提交按钮 submit 不刷新页面

<form class="needs-validation" novalidate>
  <div class="form-row">
    <div class="col-md-4 mb-3">
      <label for="validationCustom01">First namelabel>
      <input type="text" class="form-control" id="validationCustom01" placeholder="First name" value="Mark" required>
      <div class="valid-feedback">
        Looks good!
      div>
    div>
    <div class="col-md-4 mb-3">
      <label for="validationCustom02">Last namelabel>
      <input type="text" class="form-control" id="validationCustom02" placeholder="Last name" value="Otto" required>
      <div class="valid-feedback">
        Looks good!
      div>
    div>
    <div class="col-md-4 mb-3">
      <label for="validationCustomUsername">Usernamelabel>
      <div class="input-group">
        <div class="input-group-prepend">
          <span class="input-group-text" id="inputGroupPrepend">@span>
        div>
        <input type="text" class="form-control" id="validationCustomUsername" placeholder="Username" aria-describedby="inputGroupPrepend" required>
        <div class="invalid-feedback">
          Please choose a username.
        div>
      div>
    div>
  div>
  <div class="form-row">
    <div class="col-md-6 mb-3">
      <label for="validationCustom03">Citylabel>
      <input type="text" class="form-control" id="validationCustom03" placeholder="City" required>
      <div class="invalid-feedback">
        Please provide a valid city.
      div>
    div>
    <div class="col-md-3 mb-3">
      <label for="validationCustom04">Statelabel>
      <input type="text" class="form-control" id="validationCustom04" placeholder="State" required>
      <div class="invalid-feedback">
        Please provide a valid state.
      div>
    div>
    <div class="col-md-3 mb-3">
      <label for="validationCustom05">Ziplabel>
      <input type="text" class="form-control" id="validationCustom05" placeholder="Zip" required>
      <div class="invalid-feedback">
        Please provide a valid zip.
      div>
    div>
  div>
  <div class="form-group">
    <div class="form-check">
      <input class="form-check-input" type="checkbox" value="" id="invalidCheck" required>
      <label class="form-check-label" for="invalidCheck">
        Agree to terms and conditions
      label>
      <div class="invalid-feedback">
        You must agree before submitting.
      div>
    div>
  div>
  <button class="btn btn-primary" type="submit">Submit formbutton>
form>

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

<script>
// Example starter JavaScript for disabling form submissions if there are invalid fields
(function() {
  'use strict';
  window.addEventListener('load', function() {
    // Fetch all the forms we want to apply custom Bootstrap validation styles to
    var forms = document.getElementsByClassName('needs-validation');
    // Loop over them and prevent submission
    var validation = Array.prototype.filter.call(forms, function(form) {
      form.addEventListener('submit', function(event) {
        if (form.checkValidity() === false) {
          event.preventDefault();
          event.stopPropagation();
        }
        form.classList.add('was-validated');
      }, false);
    });
  }, false);
})();
script>

没问题，验证不通过会提示，无法提交。题主什么浏览器？

在form 里面添加 onsubmit="return false" 可以解决点击提交按钮刷新页面问题

<form action=""  onsubmit="return false">
    <button onclick="">我是按钮</button>
</form>

您好，我是有问必答小助手，您的问题已经有小伙伴帮您解答，感谢您对有问必答的支持与关注！
PS：问答VIP年卡 【限时加赠：IT技术图书免费领】，了解详情>>> https://vip.csdn.net/askvip?utm_source=1146287632