변경시 이벤트를 한 번만 표시하는 방법은 무엇입니까?

Question

JS에서 날짜를 확인하고 날짜를 사용자 입력과 비교하는 함수를 만들었습니다.

사용자가 입력 필드를 변경할 때 함수가 실행됩니다. 그러나 입력 필드를 변경할 때 날짜가 올바르지 않으면 오류 메시지가 두 번 또는 여러 번 유지되는 문제가 발생합니다. 왜냐하면 함수 계산은 각 변경에서 실행되기 때문입니다.

변경 사항에 오류 메시지가 표시되면 첫 번째 오류 메시지를 비활성화하고 날짜가 맞으면 오류 메시지를 제거한다고 어떻게 말 할 수 있습니까?

function calculate(){ 
    if (thereIsMissingValue()) 
     return 

    let formDate = getFormDate() 
    let comparisonDate = getComparisonDate() 
    let formNewDate = getNewDate() 

    let isOlderThanComparison = formDate < comparisonDate 
    let isNewerThanToday = formDate > formNewDate 

    if(isOlderThanComparison) { 
     $('#next-button').prop('disabled', true); 
     var $newdiv1 = $("<div id='error-form' class='error-form'><p>Error text</p></div>"); 
     $(".gform_page_fields").prepend($newdiv1); 
    }else if(isNewerThanToday) { 
     $('#next-button').prop('disabled', true); 
     var $newdiv2 = $("<div id='error-form' class='error-form'><p>Error text 2</p></div>"); 
     $(".gform_page_fields").prepend($newdiv2); 
    }else { 
     $('#next-button').prop('disabled', false); 
     $("#error-form").remove(); 
    } 
} 


$('#day, #month, #year, #hour, #minute').change(function(){ 
    calculate(); 
}); 

는

$('#day, #month, #year, #hour, #minute').one("change",function(){ 
    calculate(); 
}); 

을 시도하지만 함수는

Answer 1

이 페이지에서 오류 텍스트 사업부를 갖추는 것이 합리적이다,하지만, 숨겨진, 당신은 단지 보여줄 수/한 번만 실행 필요할 때 숨 깁니다. 상태를 변경하는 빈도는 중요하지 않습니다 그런 식으로 -

var $error = $("#error-form"); 

if(isOlderThanComparison) { 
    $('#next-button').prop('disabled', true); 
    $error.html("<p>Error text</p>"); 
    $error.show(); 
} 
else if(isNewerThanToday) { 
    $('#next-button').prop('disabled', true); 
    $error.html("<p>Error text 2</p>"); 
    $error.show(); 
}else { 
    $('#next-button').prop('disabled', false); 
    $error.hide(); 
} 

그냥 같은 페이지에 사업부를 포함해야합니다 ... 만 1 오류가있을 것이며, 항상 관련 (또는 숨겨진)입니다 이 ...

<div id="error-form"></div> 

와 CSS이 추가 ...

#error-form { 
    display: none; 
}