How do I check and change the value of an input with using javascript

Question

If user types in a value more than 5, I want to set it to 5.

function maxValCheck() {
  if (document.getElementById('xxx').value > 5) {
    document.getElementById('xxx').value = 5;
  }
}

<input id="xxx" type="number" onkeypress="maxValCheck()" max="5" min="1" value="1" />

What is wrong with the code you have provided? What errors are you getting? What isn't happening that should? What is happening that shouldn't? — Jon P
– Jon P, Commented Jun 24, 2019 at 6:24
function maxValCheck(fld) { if (fld.value > 5) { fld.value = 5; } } works too and is a better event if you pass the field: oninput="maxValCheck(this)" — mplungjan
– mplungjan, Commented Jun 24, 2019 at 6:26
stackoverflow.com/questions/10911047/keydown-event-new-value — mplungjan
– mplungjan, Commented Jun 24, 2019 at 7:07

Ritesh Khandekar · Accepted Answer · 2019-06-24 06:27:54Z

1

Just change event to onkeyup:

<input id="xxx" type="number" onkeyup="maxValCheck()" max="5" min="1" value="1"/>

answered Jun 24, 2019 at 6:27

Ritesh Khandekar

4,0153 gold badges17 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

mplungjan Over a year ago

You just suggested what?

mplungjan Over a year ago

oninput is a better event

Harshana · Accepted Answer · 2019-06-24 06:36:08Z

You can select the element by getElementById or from the querySelector and need to specify the event that you're going to trigger as the first parameter and second parameter is the function that you're going to execute on the added method in addEventListener.

<input id="xxx" type="number" max="5" min="1" value="1" />

<script>
    const selectElement = document.querySelector('#xxx');
    selectElement.addEventListener('change', function (evt) {
        console.log("value is changing in input");
    });

    // or

    document.getElementById("xxx").addEventListener('change', function (evt) {
        console.log("value is changing in input");
    });
</script>

Collectives™ on Stack Overflow

How do I check and change the value of an input with using javascript

2 Answers 2

2 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Linked

Related