Keep min value of number input with jQuery when the user enter number-CodePudding

I have an input tag, which the type is number. It has just min value "1" and no max value.

<div id="average_wrap" >
  <input id="average"  type="number" min="1">
</div>

If I enter -5 or 0, which is less than min value of the input tag, the input didn't prevent this. I want to prevent the input less than min value and put a warning for those cases, or something like that.

What is the easy way to accomplish this?

This is similar question: Input value with a min and max number. But it does not prevent the input and it just changes the min value to 1. Also, it's built with javascript (I want jQuery) and there is no way to pop a warning.

CodePudding user response：

Please try to do it like this.

jQuery("#average").on('input', function(){
    let error_tag = jQuery(".error_tag");
    error_tag.text("");
    if (jQuery(this).val() < 1) {
        jQuery(this).val("");
        error_tag.text("Please enter a valid number. It should be greater than 0.");
    }
}

CodePudding user response：

If you can use jquery function, please try to do like this.

$(document).on('input', '#average', function() {
    if( $(this).val() < 1) {
      $(this).val(1)
    } 
});