javascript – 在parsley.js验证后提交Ajax

我有一个通过ajax提交的表单.工作良好.但是,如果parsley成功验证表单,我正在尝试解决如何提交它.

问题是即使欧芹显示问题,表单也会提交.我怎么能允许这个？

<script>
  $(document).ready(function(){
  $('#newsletterSubscribe').on('submit',function(e) {

  $.ajax({
    url:'scripts/newsletter.php',
    data:$(this).serialize(),
    type:'POST',
    success:function(data){
    console.log(data);
    $("#success").show().fadeOut(20000); //=== Show Success Message==
    },
    error:function(data){
    $("#error").show().fadeOut(20000); //===Show Error Message====
    }
  }); 
  e.preventDefault(); //=== To Avoid Page Refresh and Fire the Event "Click"===
  });
  });
</script> 

解决方法:

您需要添加Parsley验证条件,如下所示：

<script>
  $(document).ready(function(){
  $('#newsletterSubscribe').on('submit',function(e) {
  e.preventDefault(); //=== To Avoid Page Refresh and Fire the Event "Click"===
  if ( $(this).parsley().isValid() ) {
     $.ajax({
       url:'scripts/newsletter.php',
       data:$(this).serialize(),
       type:'POST',
       success:function(data){
       console.log(data);
         $("#success").show().fadeOut(20000); //=== Show Success Message==
       },
       error:function(data){
         $("#error").show().fadeOut(20000); //===Show Error Message====
       }
     }); 
   }
  });
  });
</script> 

另请注意,“防止默认”行为设置为该过程的第一步.

标签：jquery,javascript,ajax,parsley-js
来源： https://codeday.me/bug/20190609/1206510.html