如何允许 html5 数字输入类型的逗号和点分隔符
Posted
技术标签:
【中文标题】如何允许 html5 数字输入类型的逗号和点分隔符【英文标题】：How to allow comma and dot separator for html5 number input type 【发布时间】：2012-05-31 22:37:26 【问题描述】：有没有办法使用 html5 数字输入类型同时允许逗号和点作为分隔符？ 我找到了 decimal-separator 属性，但它似乎只需要一个分隔符...
【问题讨论】：
有没有办法通过保持数字输入类型来做到这一点？如何解决？ 恐怕无法使用输入“数字”类型。您必须使用传统的输入“文本”类型并在文本离开或按键事件上应用格式或正则表达式。 【参考方案1】：查看我的跨浏览器 InputKeyFilter 代码示例，根据用户的系统设置，用户可以在其中输入点或逗号作为小数分隔符。
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Input Key Filter Test</title>
<meta name="author" content="Andrej Hristoliubov anhr@mail.ru">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<!-- For compatibility of IE browser with audio element in the beep() function.
https://www.modern.ie/en-us/performance/how-to-use-x-ua-compatible -->
<meta http-equiv="X-UA-Compatible" content="IE=9"/>
<link rel="stylesheet" href="https://rawgit.com/anhr/InputKeyFilter/master/InputKeyFilter.css" type="text/css">
<script type="text/javascript" src="https://rawgit.com/anhr/InputKeyFilter/master/Common.js"></script>
<script type="text/javascript" src="https://rawgit.com/anhr/InputKeyFilter/master/InputKeyFilter.js"></script>
</head>
<body>
Float field:
<input type="number" step="any" id="Float"
onchange="javascript: onChangeFloat(this)"
onblur="inputKeyFilter.isNaN(parseFloat(this.value), this);"
/>
<script>
CreateFloatFilter("Float");
function onChangeFloat(input)
inputKeyFilter.RemoveMyTooltip();
var elementNewFloat = document.getElementById("NewFloat");
var float = inputKeyFilter.parseFloat(input.value);
if(inputKeyFilter.isNaN(float, input))
elementNewFloat.innerHTML = "";
return;
elementNewFloat.innerHTML = float + " or localized value: " + float.toLocaleString();
</script>
New float: <span id="NewFloat"></span>
</body>
</html>感谢Dr.Oblak's 回复With a browser, how do I know which decimal separator does the client use?
另见我的页面example of the input key filter。
【讨论】：
【参考方案2】：在 html5 数字输入类型中不能同时使用两者。实际上它可以支持十进制或浮点数以及实数。
【讨论】：
以上是关于如何允许 html5 数字输入类型的逗号和点分隔符的主要内容，如果未能解决你的问题，请参考以下文章