Как проверить время, используя && в AJAX

Question

Я работаю с проверкой времени и я запутался о том, как validate этом start_time и end_time использование & &. У меня есть этот код до сих пор:

 var re = /^(\d{1,2}):(\d{2})([ap]m)?$/; 
    //Start Time 
    if($('.start_time').val() != '') { 
       if(regs = $('.start_time').val().match(re)) { 
       if(regs[3]) { 
        // 12-hour value between 1 and 12 
        if(regs[1] < 1 || regs[1] > 12) { 
        $('.start_time_error').html('<div>Invalid value for hour(s)</div>'); 
        $('.start_time').focus(); 
        return false; 
        } 
       } else { 
        if(regs[1] > 12){ 
        $('.start_time_error').html('<div>Invalid value for hour(s)</div>'); 
        return false; 
        } 
       } 
       // minute value between 0 and 59 
       if(regs[2] > 59) { 
        $('.start_time_error').html('<div>Invalid value for minute(s)</div>'); 
        $('.start_time').val().focus(); 
        return false; 
       } 
       } else { 
       $('.start_time_error').html('<div>Invalid time format</div>'); 
       $('.start_time').focus(); 
       return false; 
       } 
       $('.start_time_error').html('<div>Checked</div>'); 
       return true; 
      }else{ 
       $('.start_time_error').html('<div>Please fill up</div>'); 
       return false; 
      } 
      //End time---------- 
       if($('.end_time').val() != '') { 
       if(regs = $('.end_time').val().match(re)) { 
       if(regs[3]) { 
        // 12-hour value between 1 and 12 
        if(regs[1] < 1 || regs[1] > 12) { 
        $('.end_time_error').html('<div>Invalid value for hour(s)</div>'); 
        $('.end_time').focus(); 
        return false; 
        } 
       } else { 
        if(regs[1] > 12){ 
        $('.end_time_error').html('<div>Invalid value for hour(s)</div>'); 
        return false; 
        } 
       } 
       // minute value between 0 and 59 
       if(regs[2] > 59) { 
        $('.end_time_error').html('<div>Invalid value for minute(s)</div>'); 
        $('.end_time').val().focus(); 
        return false; 
       } 
       } else { 
       $('.end_time_error').html('<div>Invalid time format</div>'); 
       $('.end_time').focus(); 
       return false; 
       } 
       $('.end_time_error').html('<div>Checked</div>'); 
       return true; 
      }else{ 
       $('.end_time_error').html('<div>Please fill up</div>'); 
       return false; 
      } 

Я пытался что-то вроде:

if(regs = $('.start_time').val().match(re) && regss == $('.end_time').val().match(re)) 

Но не работает для меня он отправляет и ошибок regss is not defined. Какие-нибудь альтернативы в том, как это сделать? Благодаря!

Answer 1

Я думаю, вы усложняете вещи ... Подумайте о разделении проблем. В вашей логике у вас есть 2 основных блока, проверка для строки времени и манипуляция DOM для извлечения этих значений и печати ошибки. В вашем текущем коде вы повторяете одну и ту же логику дважды для двух полей, почему бы не абстрагировать это на функцию?

Тогда я думаю, что не стоит печатать несколько ошибок, если время недействительно, тогда скажите что-то вроде «вы ввели недействительное время» и дадите пользователю знать правильный формат, с заполнителем на входе или в общее сообщение об ошибке.

Если вы следуете этим инструкциям, возможно, вы сократите свой код на до и сделайте очистительнее и понятнее. Вот пример, я приспособил регулярное выражение из this question:

function isTime(str) { 
    return /^([1-9]|1[012]):[0-5][0-9]\s*?(am|pm)$/i.test(str); 
} 

Теперь вы можете проверить свои входы следующим образом:

var start = $.trim($('.start_time').val()) 
    , end = $.trim($('.end_time').val()); 

if (!isTime(start) || !isTime(end)) { 
    $('.generic_error').html('<div>Please enter a valid time (HH:MM AM/PM)</div>'); 
} 

Не уверен, что о вашем HMTL, но это должно дать общее представление о том, как абстрактный ваш код, чтобы сделать его сухим (не повторяйте сам).

Демо:http://jsbin.com/ayAbUyI/1/edit