javaScript - 数字输入 - 接受特定数字

Question

I have 5 inputs with type 'number'. max value to be entered by the user is '5'.
I want if the user enter for example '4' in the first input field . he can't submit this number again in the other fields.

or he can but then an message pop up to alert him.
it 'd be great if the alert is built in the browser like when he enter a number that more than the 'max' the field get red as a wrong assignment.

I can make an array and when the user submit an value I check if that value in the array and if not I push it in the array but then I 'll have to make an alert design.

I just looking for smart and easy solution.

<input type='number' max = '5' onchange = 'change(this)'>
<input type='number' max = '5' onchange = 'change(this)'>
<input type='number' max = '5' onchange = 'change(this)'>
<input type='number' max = '5' onchange = 'change(this)'>
<input type='number' max = '5' onchange = 'change(this)'>

function change(it)
{
  // what shoult I do ?!...

}

thanks.

Answer 1

You can use jquery and compare value of fields with each other upon change. See this answer:

https://stackoverflow.com/a/30307040/1333744

Answer 2

What you can do is, give every input a class, lets say 'foo' .

Then the JQuery goes as:

$(".foo").on('change', function () {
    var inputNumber = $(this).val();
    if (inputNumber > 5) {
    alert("Can't enter more than 5! Sorry");
    $(this).val(5);
    } else {
     var array = [];
        $siblings = $(this).siblings();
        $.each($siblings, function (key, value) {
           array.push($(value).val()); 
        });
if ($.inArray($(this).val(), array) !== -1)
    {
        alert("You have already entered that number");
    }
    }
});

HTML:

<input type='number' max = '5' class='foo'>
<input type='number' max = '5' class='foo'>
<input type='number' max = '5' class='foo'>
<input type='number' max = '5' class='foo'>
<input type='number' max = '5' class='foo'>

If you don't want to use jQuery, then go on, convert the jQuery to Javascript by looking at the code provided.