如何在提交之前让Ajax使用CSS表单验证

时间:2017-10-21 01:56:32

标签: css ajax forms validation

在提交之前使用CSS表单验证的最佳方法是什么?现在它无论如何都会提交。

$('#contact_submit_btn').click(function(e) {
    e.preventDefault(); // This will prevent page refresh
    $.ajax({
        url: 'contact_form.php',
        type: 'POST',
        data: $("#contact_form_id").serialize(),
        success: function(msg) {
            alert('Email Sent');
            //contact_submit();
        }               
    });
});

我想一个简单的if / else我只是不知道要检查什么。

1 个答案:

答案 0 :(得分:1)

您可以执行if / else语句,也可以使用多个不同的库。例如,jquery有一个可以使用的表单验证插件。这种情况下的代码如下所示:

$( "form" ).submit(function( event ) {
  if ( $( "input:first" ).val() === "correct" ) {
     $.ajax({
        url: 'contact_form.php',
        type: 'POST',
        data: $("#contact_form_id").serialize(),
        success: function(msg) {
            alert('Email Sent');
            //contact_submit();
        }               
    });
  }

  $( "span" ).text( "Not valid!" ).show().fadeOut( 1000 );
  event.preventDefault();
});