Why is there a selection in the input when the last character is entered?

Question

JavaScript

When you enter the last character in the input, there is a "self-selection", how to remove it?

<input id="phone" type="text" class="form-control" autofocus autocomplete="off" name="phone"  data-mask="[phone]" required/>

I tried to style it:

$("#phone").css("-moz-user-select", "-moz-none");
  $("#phone").css("-o-user-select:", "none;");
  $("#phone").css("-khtml-user-select", "none");
  $("#phone").css("-webkit-user-select", "none");
  $("#phone").css("-user-select", "none");

but it doesn't work.

Here is all the code in the sandbox: jsfiddle.net/t52ka/44

Answer 1

I'm posting the solution to the question, as it is quite possible that someone will have such a problem.
It's all about the Masked Input Plugin. When the position matches the length of the mask, the text is highlighted.
Here is this line:

pos == mask.replace("?", "").length ? input.caret(0, pos) : input.caret(pos);

replace it with: writeBuffer(), input.caret(pos);

Answer 2

You have a piece of code there that just abounds with SelectionRange and textRange. It's hard for me to understand why this piece, but it seems that it is he who makes the selection.