CODEWITHSUNDEEP
html
U_R_Naveen UR_Naveen
U_R_Naveen UR_Naveen

Reputation: 788

HTML: Why does The <input> tag with type email is not including number of spaces to its content length

In HTML the input tag with type email is not including number of spaces to its length. It is showing length of value as 0 for any number of spaces, but if you see visually the browser will show spaces in email input box.

But the input tags with other type are counting the spaces along with the alphanumeric data.

What was the wrong here or am I missing any concept here?

var inputs = document.querySelectorAll('input');

for(var i = 0; i < inputs.length; i++) {
  var input = inputs[i];
  input.addEventListener('change', function (e) {
    var input = e.target;
    console.log(input.id + ": length = " + input.value.length);
  });
}
input { display: block;}
<label for='email'>Email</label>
<input type='email' id='email'>

<label for='text'>Text</label>
<input type='text' id='text'>

Upvotes: 1

Views: 298

Answers (1)

James Fenwick
James Fenwick

Reputation: 2211

This is defined in the HTML standard. https://html.spec.whatwg.org/multipage/input.html#e-mail-state-(type=email)

The browser is applying the value sanitization algorithm as specified for the email type.

The value sanitization algorithm is as follows: Strip newlines from the value, then strip leading and trailing ASCII whitespace from the value.

Upvotes: 1

Related Questions