在数字类型输入中，新的WebKit将十进制逗号转换为~点，反之亦然。浏览器功能的Javascript名称？
我在最新的Chrome（35；Win/Android/iOS）和Safari（7；iOS）版本中发现了一个最独特的浏览器功能。如果您有一个带有在数字类型输入中，新的WebKit将十进制逗号转换为~点，反之亦然。浏览器功能的Javascript名称？,javascript,html,input,webkit,browser-feature-detection,Javascript,Html,Input,Webkit,Browser Feature Detection,我在最新的Chrome（35；Win/Android/iOS）和Safari（7；iOS）版本中发现了一个最独特的浏览器功能。如果您有一个带有input type=“number”的数学表单，并且输入一个带有小数点逗号的数字，浏览器将使用该数字进行计算，就像逗号是一个点一样。如果你输入带有小数点的数字，它们会进行正常的计算，但结果会以小数点逗号显示。也就是说，在我的欧洲（即荷兰语）版本中。我不知道美国版本 如果你觉得难以置信，我做了一个演示来演示： <!DOCTYPE html> &
input type=“number”<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Demo Browser Behavior w/ Number Inputs</title>
<style>
input {
box-sizing: border-box;
margin-top: 10px;
width: 100px;
}
</style>
</head>
<body>
<form name="theForm">
<input type="number" name="A1field" min="0" max="100" step="0.1"> Input field
<br>
<input type="number" name="A2field" min="0" max="100" step="0.1"> Input field
<br>
<input type="button" value="Calculate" onclick="calculateAndPopulate()">
<br>
<input type="number" name="R1field" min="0" max="10000" step="0.01"> Result field
<br>
<input type="reset" value="Reset">
</form>
<script>
function calculateAndPopulate() {
var A1val = theForm.A1field.value;
var A2val = theForm.A2field.value;
var R1 = (A1val*A2val);
theForm.R1field.value = R1;
}
</script>
</body>
</html>
带数字输入的演示浏览器行为
输入{
框大小：边框框；
边缘顶部：10px；
宽度：100px；
}
输入字段
输入字段
结果字段
函数calculateAndPopulate（）{
var A1val=form.A1field.value；
var A2val=form.A2field.value；
var R1=（A1val*A2val）；
form.R1 field.value=R1；
}
输入类型=数字（转换或转换）逗号（点或句点或“句号”）浏览器功能进行广泛的互联网搜索- 一致的浏览器间行为：所有浏览器和浏览器版本的行为应相同
- 浏览器内行为一致：输入字段中的十进制逗号=输出字段中的十进制逗号。小数点的计数相同
- web开发人员应该可以选择强制使用逗号或点
- 访客的无意输入错误必须纠正或捕获。点和逗号键总是紧挨在一起，很难看出它们之间的区别，尤其是在小屏幕上
- 在平板电脑上，获得焦点的数字输入字段应拉起数字键盘/键盘
- 有效的HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Math form with forced dot separator</title>
<style>
input {
box-sizing: border-box;
margin-top: 10px;
width: 100px;
}
input[type="tel"]:invalid {
box-shadow: none; /* 0 doesn't work */
}
</style>
</head>
<body>
<h3>Math form with forced dot separator</h3>
<form name="theForm">
<input type="tel" name="A1field"> Input field
<br>
<input type="tel" name="A2field"> Input field
<br>
<input type="button" value="Multiply" onclick="multiplyAndPopulate()">
<br>
<input type="tel" name="R1field"> Result field
<br>
<input type="reset" value="Reset">
</form>
<script>
var telInputs = document.querySelectorAll('input[type="tel"]');
for (var i=0; i<telInputs.length; i++) {
telInputs[i].onblur = function() {
this.value = this.value.replace(',','.');
}
}
function multiplyAndPopulate() {
var A1 = theForm.A1field.value;
var A2 = theForm.A2field.value;
var R1 = (A1*A2);
if (isNaN(R1) == true) {
alert('In one or more input fields you have used more than the allowed one comma or dot, or entered a non-numerical character.');
return false;
}
else {
theForm.R1field.value = R1;
}
}
</script>
</body>
</html>
带强制点分隔符的数学形式
输入{
框大小：边框框；
边缘顶部：10px；
宽度：100px；
}
输入[type=“tel”]：无效{
框阴影：无；/*0不起作用*/
}
带强制点分隔符的数学形式
输入字段
输入字段
结果字段
var telInputs=document.querySelectorAll（'input[type=“tel”]”）；
对于（VARI=0；如果是，则使用UK语言环境（小数点）Win上的Chrome将任何带有逗号的值视为无效。因此，这似乎只起到了一种作用，因此我认为这是Chrome中的一个缺陷。我没有答案，但这里有一些相关的问题：，@jfrej-这也是我的Chrome 18，作为预览选项之一嵌入到我的代码编辑器中所做的。但在第18和35节之间的任何地方都是如此行为已经改变。Chrome maker的链接文章（即与用户的讨论）很明显，这不是一个bug，而是一个特性。关于您链接到的SO线程：我在各种配置中广泛地尝试了该模式方法，但它并不能解决特殊的输出问题——总是使用逗号作为小数分隔符。不过，我会再检查一遍，如果我以任何方式进行了管理，我会告诉您。@jfrej-In另外：将输入类型设置为text
与正则表达式模式结合使用确实可以解决数学/显示行为，但使用text
时，平板电脑会在模式中包含一个点或逗号时立即拔出它们的普通键盘。我有一个表格，其中最多需要输入11个数字，这对我来说太烦人了r平板电脑用户每次都必须将键盘切换为数字。@jfrej:我终于找到了答案。请看我（自己）的答案。您的解决方案在iPhone上不起作用（用iOS7或iOS8测试），因为在iPhone上显示的是0-9虚拟键盘，它没有正常的移位键盘（而是带有[+*\35;]的0-9键盘）
键和no[。]
或[，]
键可用。我可以不叫喊（大写），但谢谢你的反馈。我没有在iPhone上测试它。我在iPad上测试了它，因为我的Android平板电脑和手机在键盘上没有区别，所以我认为iPhone和iPad之间也没有区别。但是
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Math form with forced comma separator</title>
<style>
input {
box-sizing: border-box;
margin-top: 10px;
width: 100px;
}
input[type="tel"]:invalid {
box-shadow: none; /* 0 doesn't work */
}
</style>
</head>
<body>
<h3>Math form with forced comma separator</h3>
<form name="theForm">
<input type="tel" name="A1field"> Input field
<br>
<input type="tel" name="A2field"> Input field
<br>
<input type="button" value="Multiply" onclick="multiplyAndPopulate()">
<br>
<input type="tel" name="R1field"> Result field
<br>
<input type="reset" value="Reset">
</form>
<script>
var telInputs = document.querySelectorAll('input[type="tel"]');
for (var i=0; i<telInputs.length; i++) {
telInputs[i].onblur = function() {
this.value = this.value.replace('.',',');
}
}
function multiplyAndPopulate() {
var A1 = theForm.A1field.value.replace(',','.'); // not visible
var A2 = theForm.A2field.value.replace(',','.'); // not visible
var R1 = (A1*A2);
if (isNaN(R1) == true) {
alert('In one or more input fields you have used more than the allowed one comma or dot, or entered a non-numerical character.');
return false;
}
else {
theForm.R1field.value = R1;
theForm.R1field.value = theForm.R1field.value.replace('.',',');
}
}
</script>
</body>
</html>