英文:
maxlength conflicting with webkit
问题
我在我的数字输入中添加了一个 maxlength 设置，它在我尝试移除侧边的数字箭头之前是有效的。它们是否以某种方式相互冲突？
<input type='number' id='numberInput' maxlength='16' placeholder='输入一个数字*'></input>
当我添加以下 CSS 时，它停止工作：
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
::-webkit-input-placeholder {
text-align: center;
}
:-moz-placeholder {
text-align: center;
-moz-appearance: text-field;
}
JSFiddle（已注释）供检查
英文:
I added a maxlength setting to my number input and it worked until I tried to remove the number arrows from the side. Do they somehow conflict with eachother?
<input type='number' id='numberInput' maxlength='16' placeholder='Enter a number*'></input>
It stopped working when I added this to the css
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
::-webkit-input-placeholder {
text-align: center;
}
:-moz-placeholder {
text-align: center;
-moz-appearance: text-field;
}
JSFiddle (commented) for inspection
答案1
得分: 1
maxlength不支持type="number"。如果切换到type="text"，它将起作用，但在移动设备上，您将失去数字键盘作为第一个建议。
作为解决方法，尝试用onKeyPress="if(this.value.length==16) return false;"替换maxlenght="16"，
英文:
maxlength is not supported by type="number". It would work if you switch to type="text", but on mobile devices you will lose the numerical keyboard as first suggestion.
As workaround, try to replace maxlenght="16" with onKeyPress="if(this.value.length==16) return false;",
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论