Question

我的问题是，当我单击带有空文本字段的提交按钮时，将显示验证，并且当我填写所有文本框并提交时模态只是闪烁。我认为他们的观点有误在我的剧本上。

这是我的验证脚本：

<script>
(function() {
  'use strict';
  window.addEventListener('load', function() {
    var forms = document.getElementsByClassName('needs-validation');
    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>

这是我的模态消息：

  <script>
      $(document).ready(function(){
        $("#submit").click(function(){
          if($('#username').val().trim().length > 0 && $('#id').val().trim().length > 0) {
             $("#modalSuccess").modal();
          } 
        });
      });
    </script>

希望您能帮助我修复它。谢谢

Answer 1

您可以尝试

if (form.checkValidity() === false) {
   event.preventDefault();
   event.stopPropagation();
   this.classList.add('was-validated');
}
else if (form.checkValidity() === true) {
   you success script
}

Answer 2

类似这样的东西：

<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, viewport-fit=cover" />

提交后显示感谢信息

2 个答案: