I don’t know if there’s a way to do that, but you can strip the leading zeroes as an alternative (
). Note that the examples use standards‐compliant JavaScript (and CSS) and thus aren’t supported by Internet Explorer; you’ll have to adjust the code to get them to work in that browser.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="Author" content="Patrick Garies">
<title>DIC 23550 Script: Kill Leading Zeroes in Form Fields</title>
<style type="text/css">
* { margin: 0; font: 18px/1.4 "Lucida Sans Unicode", "Lucida Grande", sans-serif; }
body { display: table; margin: 0 auto; border-spacing: 1em; text-align: center; }
body > div { display: table-row; }
h1 { margin: 0.1em 0; font-weight: bold; text-align: left; }
label::after { content: " "; }
span::after { content: ":"; }
code { vertical-align: top; font-family: "Courier New", monospace; }
input { width: 8em; }
div.message { color: green; }
</style>
<script type="text/javascript">
var input;
document.defaultView.addEventListener("load", basic, false);
function basic() {
input = document.getElementsByTagName("input");
input[0].addEventListener("keyup", validate, false);
input[0].addEventListener("focus", clear, false);
input[0].addEventListener("blur", restore, false);
input[2].addEventListener("focus", clear, false);
input[2].addEventListener("blur", restore, false);
}
/* This prevents the input of leading zeroes. */
function validate() {
for (var i = 0; this.value.charAt(i) == "0" && this.value.length != 1; i++) {
this.value = this.value.substring(1);
}
}
/* This returns an integer with the leading zeroes stripped. */
function calculate() {
var i = 0;
for (i; input[2].value.charAt(i) == "0"; i++) {
if (parseInt(input[2].value) == 0) {
input[2].value = "0"; /* For example, “00” is reduced to “0”. */
break;
}
}
var output = document.createElement("div");
output.className = "message";
output.appendChild(document.createTextNode("The number specified is " + parseInt(input[2].value.substring(i)) + "."));
document.getElementsByTagName("body")[0].appendChild(output);
}
/* This clears the default value if the default value is specified. */
function clear() {
if (this.value == this.defaultValue) {
this.value = "";
}
}
/* This restores the default value if no value is specified. */
function restore() {
if (this.value == "") {
this.value = this.defaultValue;
}
}
</script>
</head>
<body>
<div>
<h1>Process Using <code>validate()</code></h1>
<label><span>Number</span> <input type="text" value="0"></label>
<input type="submit" value="Submit">
</div>
<div>
<h1>Process Using <code>calculate()</code></h1>
<label><span>Number</span> <input type="text" value="0"></label>
<input type="submit" onclick="calculate();" value="Submit">
</div>
</body>
</html>
| 