admin管理员组

文章数量:1318183

How to remove dot using replace javascript in input type number ?

When i tried fill 999. into input. Why it's not remove dot . How can i do ?

<input name="test" id="iid" onKeyUp="test_fn(this.value)" type="number">

<script>
function test_fn(test_value){
	var test_value = test_value.replace(/[^0-9]+/g, "");
	document.getElementById("iid").value = test_value;
}
</script>

How to remove dot using replace javascript in input type number ?

When i tried fill 999. into input. Why it's not remove dot . How can i do ?

<input name="test" id="iid" onKeyUp="test_fn(this.value)" type="number">

<script>
function test_fn(test_value){
	var test_value = test_value.replace(/[^0-9]+/g, "");
	document.getElementById("iid").value = test_value;
}
</script>

Share Improve this question asked Aug 19, 2017 at 17:44 suttakan mongkonsuttakan mongkon 1111 gold badge2 silver badges6 bronze badges 1
  • It works, but not until the next keystroke is entered. The reason is because the value of the input element isn't updated until some time after keyup finishes. Another problem is that if you enter two dots in a row, the whole value is emptied. – James Commented Aug 19, 2017 at 17:48
Add a ment  | 

5 Answers 5

Reset to default 3

Perhaps you want to just not allow dots to be entered in the input field. Here's one way of doing that:

document.getElementById('iid').addEventListener('keypress', test_fn);

function test_fn(e){
  if (e.charCode == 46) e.preventDefault(); // not allowed to type .
}
<input name="test" id="iid" type="number">

See this fiddle

I don't know the reason of such a behavior. What I've done to solve such a problem is that, I will clear the contents of the input each time a key is pressed.

I've added the below given line to your Script which will reset the input each time a key is pressed.

    document.getElementById("iid").value = "";

Please see the Snippet below

function test_fn(test_value){
	var test_value = test_value.replace(/[^0-9]+/g, "");
	document.getElementById("iid").value = "";
	document.getElementById("iid").value = test_value;
}
<input name="test" id="iid" onKeyUp="test_fn(this.value)" type="number">

UPDATE

As @AssafiCohen-Arazi mentioned in his ment, this answer will prove to be incorrect if someone keeps on pressing the . key for so long. Thus, the better solution would be the one that is mentioned in @James answer above.

UPDATE 2

Found out the reason why you were getting in-stable results. It was all because your input type was number. You can just change your input type to text and your code will run perfectly.

See this fiddle

See the snippet below

function test_fn(test_value){
	var test_value = test_value.replace(/[^0-9]/g, "");
	document.getElementById("iid").value = test_value;
}
<input name="test" id="iid" onKeyUp="test_fn(this.value)" type="text">

<input name="test" id="iid" onKeyUp="test_fn(this.value)" type="text">

<script>
function test_fn(test_value){
	var test_value = test_value.replace(/[^0-9]+/g, "");
	document.getElementById("iid").value = test_value;
}
</script>

It is working fine for me, try this:

function test_fn(e){
    var charCode = e.which || e.keyCode;
 if (charCode >= 48 && charCode <= 57 || charCode >= 96 && charCode <= 105) return true;
    e.preventDefault();
}
<input name="test" id="iid" onKeyDown="test_fn(event)" type="number">

The type=number in the input field triggers a value sanitization algorithm hence you cannot get the actual value from the input field unless it's a valid floating point number.

You can work around this by using a text type (since you're already checking numeric values with the regulare expression /[^0-9]+/g

<input name="test" id="iid" onKeyUp="test_fn(this.value)" type="text">

<script>
  function test_fn(test_value) {
    var test_value = test_value.replace(/[^0-9]+/g, "");
    document.getElementById("iid").value = test_value;
  }
</script>

See also: How to get the raw value an field?

本文标签: jqueryHow to remove dot using replace javascript in input type numberStack Overflow