Проверка формы с помощью jQuery (без validation.js)

Question

Я хочу выполнить проверку формы с помощью jQuery. Сейчас я использую HTML5 «необходимый» внутри входного тега, и этот код JQuery для проверки:

JQuery:

$("#register").click(function() { 

    $("#register input").each(function() { 
     $(this).css('border','none'); 
     if(!$(this).val()) { 
      $(this).css('border','solid 1px red'); 
     } 
     var email_reg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/; 
     if($(this).attr("type")=="email" && !email_reg.test($(this).val())){ 
      $(this).css('border','solid 1px red'); 
     } 
    }); 

При использовании IE9, нет поддержки в HTML5 «требуется» , поэтому, хотя скрипт работает, он все еще запускает файл INF-файла ввода. Я буду рад узнать, могу ли я исправить это с использованием существующего кода и без использования validate.js или других внешних файлов.

HTML5:

<form id="register" action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']);?>" method="post"> 
<p><label>First name</label><input type="text" id="name" name="name" required="true" /></p> 
<p><label>Last name</label><input type="text" id="fname" name="fname" required="true" /></p> 
<p><label>Email</label><input type="email" id="email" name="email" required="true" /></p> 
<p> 
    <label>Phone</label> 
    <input id="area-code" type="text" name="code" maxlength="3" required="true" onkeydown="return isNumber(event);" /> 
    <input id="phone" type="text" name="phone" required="true" maxlength="17" onkeydown="return isNumber(event);" /> 

</p> 
<input type="submit" value="GET BONUS NOW" id="submit-btn" /> 
<?php include 'form.php';?> 

Answer 1

Вам необходимо перейти от проверки из click события в submit:

$("#register").submit(function() { 

и изменить код, чтобы искать ошибки с некоторыми булева флага и возвращения false если ошибки не найдены:

var errors = false; 
$("#register input").each(function() { 

    $(this).css('border','none'); 
    if(!$(this).val()) { 
     $(this).css('border','solid 1px red'); 
     errors = true; 
    } 
    var email_reg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/; 
    if($(this).attr("type")=="email" && !email_reg.test($(this).val())){ 
     $(this).css('border','solid 1px red'); 
     errors = true; 
    } 
}); 
if(errors) { 
    return false; 
}