Jquery 表单在验证后未提交

Question

不知道为什么，但我的表单在我验证后不会提交。 我知道我不应该使用任何名称或 ID 为“提交”的输入字段，而我没有这样做。 我假设阻止默认方法正在停止提交？ 提交前如何验证？

<form method="post" id="offersForm" enctype="multipart/form-data">
        <input type="text" name="offerTitle" id="offerTitle" maxlength="70" class="form-control yellow" placeholder="Offer title" value="" />


        <input type="submit" id="addOffer" name="addOffer" class="btn button-black" value="Add Offer" />
     </form> 


<script type="text/javascript">
$(document).ready(function() {

  $('#offersForm').submit(function(e) {
        e.preventDefault();
        var offerTitle = $('#offerTitle').val();

        $(".error").removeClass('error');

        if (offerTitle.length < 1) {
            $('#offerTitle').addClass('error');
            return false;
        }

        return true

    });
  });
</script>

Answer 1

请检查我已经修复了你的代码。

 $(document).ready(function() { $('#addOffer').click(function() { var offerTitle = $('#offerTitle').val(); $(".error").removeClass('error'); if (offerTitle.length < 1) { $('#offerTitle').addClass('error'); return false; } $('#offersForm').submit(); return true }); });

 .error{ border-color: red; }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <form method="post" id="offersForm" enctype="multipart/form-data"> <input type="text" name="offerTitle" id="offerTitle" maxlength="70" class="form-control yellow" placeholder="Offer title" value="" /> <input type="button" id="addOffer" name="addOffer" class="btn button-black" value="Add Offer" /> </form>

Answer 2

 $(document).ready(function() { $('#addOffer').click(function(e) { e.preventDefault(); var offerTitle = $('#offerTitle').val(); $(".error").removeClass('error'); if (offerTitle.length < 1) { $('#offerTitle').addClass('error'); return false; } $('#offersForm').submit(); return true }); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <form method="post" id="offersForm" enctype="multipart/form-data"> <input type="text" name="offerTitle" id="offerTitle" maxlength="70" class="form-control yellow" placeholder="Offer title" value="" /> <input type="button" id="addOffer" name="addOffer" class="btn button-black" value="Add Offer" /> </form>