输入可以只填写10位数字使用Javascript不工作在Firefox上为什么?
问题描述:
输入可以只填写10位数字使用JavaScript不工作在Firefox上为什么?输入可以只填写10位数字使用Javascript不工作在Firefox上为什么?
填充EG:0258748542
我在铬上测试它很好用。 但不能在Firefox上工作为什么?
我该怎么做?
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<input name="ten_number" onkeyup="check_ten_number_length_up(this.value)" onkeydown="return check_ten_number_length_down(this,10);" type="number" class="feedback-input" id="ten_number" placeholder="please enter 10 digits" onchange="updateInput_ten_number(this.value)">
<span id="mySpan_ten_number"></span>
<script>
function check_ten_number_length_up(ten_number_value){
\t var ten_number_value = ten_number_value.replace(/[^0-9]+/g, "");
\t document.getElementById("ten_number").value = "";
\t document.getElementById("ten_number").value = ten_number_value;
\t var ten_number_value = document.getElementById("ten_number").value;
\t
\t if(ten_number_value.length==10)
\t {
\t \t document.getElementById("ten_number").style.border = "1px solid rgba(72,72,72,0.4)";
\t \t document.getElementById("mySpan_ten_number").innerHTML = "";
\t }
\t else
\t {
\t \t document.getElementById("ten_number").style.border = "1px solid red";
\t \t document.getElementById("mySpan_ten_number").innerHTML = "please enter 10 digits";
\t }
}
</script>
<script>
function updateInput_ten_number(ten_number_value){
var ten_number_value_length = ten_number_value.length;
if(ten_number_value_length != "10")
{
document.getElementById("ten_number").style.border = "1px solid red";
document.getElementById("mySpan_ten_number").innerHTML = "please enter 10 digits";
\t }
\t else
\t {
document.getElementById("ten_number").style.border = "1px solid rgba(72,72,72,0.4)";
document.getElementById("mySpan_ten_number").innerHTML = "";
\t }
}
</script>
<script>
function check_ten_number_length_down(ten_number_value,max_length){
if([8, 37,38,39,40, 46].indexOf(event.which) == -1)
{
return ten_number_value.value.length < max_length;
}
}
</script>
答
不要将您的活动传递给check_ten_number_length_down()
功能。 您也不需要使用空字符串更新该值,而只需使用旧值再次覆盖它。
function check_ten_number_length_up(ten_number_value){
\t var ten_number_value = ten_number_value.replace(/[^0-9]+/g, "");
\t
\t if(ten_number_value.length==10)
\t {
\t \t document.getElementById("ten_number").style.border = "1px solid rgba(72,72,72,0.4)";
\t \t document.getElementById("mySpan_ten_number").innerHTML = "";
\t }
\t else
\t {
\t \t document.getElementById("ten_number").style.border = "1px solid red";
\t \t document.getElementById("mySpan_ten_number").innerHTML = "please enter 10 digits";
\t }
}
function updateInput_ten_number(ten_number_value){
var ten_number_value_length = ten_number_value.length;
if(ten_number_value_length != "10")
{
document.getElementById("ten_number").style.border = "1px solid red";
document.getElementById("mySpan_ten_number").innerHTML = "please enter 10 digits";
\t }
\t else
\t {
document.getElementById("ten_number").style.border = "1px solid rgba(72,72,72,0.4)";
document.getElementById("mySpan_ten_number").innerHTML = "";
\t }
}
function check_ten_number_length_down(event, ten_number_value, max_length){
if([8, 37,38,39,40, 46].indexOf(event.which) == -1)
{
return ten_number_value.value.length < max_length;
}
}
input[type=number] {-moz-appearance: textfield;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<input name="ten_number" onkeyup="check_ten_number_length_up(this.value)" onkeydown="return check_ten_number_length_down(event, this, 10);" type="number" class="feedback-input" id="ten_number" placeholder="please enter 10 digits" onchange="updateInput_ten_number(this.value)">
<span id="mySpan_ten_number"></span>
但仍不能在第一个数字填0。 –
现在修复了。 – Wouter
with input [type = number] {-moz-appearance:textfield;} – Wouter