how to limit number of characters in html input code example

Example 1: how to specify amout of letters in inputfield in css

<input maxlength="25" placeholder="name" />

Example 2: limit input characters amount

<p><input placeholder="Title" id="input-title" class="text-input" maxlength="80" onkeyup="count_down(this)"  name="input" ></p>
      <span id="count" style="float: right; font-family: Raleway; font-size:20px; font-weight:600; margin-top:-5px;">80</span><br>

<script>
  function count_down(obj){

    let element = document.getElementById('count');

    element.innerHTML = 80 - obj.value.length;

    if(80 - obj.value.length < 5){
        element.style.color = "firebrick";
    }else{
        element.style.color = "#333";
    }
}
</script>

Example 3: how to limit input type max length

<input name="somename"
    oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);"
    type = "number"
    maxlength = "6"
 />

Example 4: text limit in html

<span style="
  display:inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 13ch;">
Lorem ipsum dolor sit amet
</span>

Example 5: how to limit characters in number input js

function limit(element)
{
    var max_chars = 2;

    if(element.value.length > max_chars) {
        element.value = element.value.substr(0, max_chars);
    }
}


<!-- HTML -->
<input type="number" onkeydown="limit(this);" onkeyup="limit(this);">

Tags:

Misc Example