Set value to Input type number not working correctly
Question
I want to set a value to input type number using Jquery. It's not working when the length of value is more than 15 characters.
Here is my sample code:
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("#user").val(11111111111111444444444888888888);
});
});
</script>
</head>
<body>
<p>Name: <input type="number" id="user" ></p>
<button>Set the value of the input field</button>
</body>
</html>
The result is:
11111111111111400000000000000000
It is unexpected for me. Why does it become zero after 15 characters? It is working fine when the length of the number is less than 15. I tried to use the min and max attribute, but this isn't working either. Any idea?
2 answers
solution1
0 2018-04-18 10:28:11
I think this is because javascript numbers are always 64-bit floating point.
Unlike many other programming languages, JavaScript does not define different types of numbers, like integers, short, long, floating-point etc.
JavaScript numbers are always stored as double precision floating point numbers, following the international IEEE 754 standard.
Examples:
var x = 999999999999999; // x will be 999999999999999
var y = 9999999999999999; // y will be 10000000000000000
Explication and example gathered from W3Schools .
Maybe you can add '' to the val() in order to pass the value as a string.
solution2
0 2018-04-18 10:31:01
As Goediaz has the explanation of this behaviour,
You may want to put it in val() as a string.
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> $(document).ready(function(){ $("button").click(function(){ $("#user").val(11111111111111444444444888888888); console.log("Number:", $("#user").val()); $("#user").val("11111111111111444444444888888888"); console.log("String:", $("#user").val()); }); }); </script> </head> <body> <p>Name: <input type="number" id="user" ></p> <button>Set the value of the input field</button> </body> </html>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.