实施jquery验证后，我的动画不再播放

Question

我从此代码笔中获取表单验证和jquery动画问题：https://codepen.io/sfaisal/pen/rVWBXp

$(document).ready(function() {
  $(".submit").click(function() {
    $(".submit").addClass("loading");
    setTimeout(function() {
      $(".submit").addClass("hide-loading");
      // For failed icon just replace ".done" with ".failed"
      $(".done").addClass("finish");
    }, 1800);

    setTimeout(function() {
      $(".submit").removeClass("loading");
      $(".submit").removeClass("hide-loading");
      $(".done").removeClass("finish");
      $(".failed").removeClass("finish");
    }, 5000);
  })
});

动画效果很好，但是我在表单中的输入中已“需要”元素。在按钮上单击，动画播放，但是我得到一个工具提示来填写所需的输入。总体而言，这是糟糕的UX，我希望在填充必需的输入之前禁用该按钮。

var validator = $("#gform").validate();
validator.element("#submit");

这是我想出的，但是当使用此代码时，动画不再播放。有什么想法吗？

谢谢