将值设置为货币(Set value to currency in <input type=“n

我想通过格式化使用javascript用户进入货币数量的输入。 这适用于细<input type="text" /> 然而，在<input type="number" />我不能似乎能够将该值设置为任何包含非数字值。 下面拨弄显示我的问题

http://jsfiddle.net/2wEe6/72/

反正对我来说，值设置为类似$125.00 ？

我想使用<input type="number" />这样的移动设备知道，弹出一个键盘输入号码。

Answer 1:

添加step="0.01"到<input type="number" />参数：

<input type="number" min="0.01" step="0.01" max="2500" value="25.67" />

演示： http://jsfiddle.net/uzbjve2u/

但是，美元符号必须停留在文本框外......每一个非数字或分离charachter将被自动裁剪。

否则，你可以使用一个经典文本框， 就像这里描述的 。

Answer 2:

最后，我提出了jQuery插件，将格式化<input type="number" />适当我。 我也注意到在一些移动设备上min和max属性实际上并不阻止你进入低于规定值或更高的数字，所以该插件将占到太多。 下面是代码和一个示例：

 (function($) { $.fn.currencyInput = function() { this.each(function() { var wrapper = $("<div class='currency-input' />"); $(this).wrap(wrapper); $(this).before("<span class='currency-symbol'>$</span>"); $(this).change(function() { var min = parseFloat($(this).attr("min")); var max = parseFloat($(this).attr("max")); var value = this.valueAsNumber; if(value < min) value = min; else if(value > max) value = max; $(this).val(value.toFixed(2)); }); }); }; })(jQuery); $(document).ready(function() { $('input.currency').currencyInput(); }); 

 .currency { padding-left:12px; } .currency-symbol { position:absolute; padding: 2px 5px; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <input type="number" class="currency" min="0.01" max="2500.00" value="25.00" /> 

Answer 3:

你们是完全正确的电话号码只能在数字字段中去。 我使用的是已经与位上的跨度标签的CSS样式的上市同样的事情：

<span>$</span><input type="number" min="0.01" step="0.01" max="2500" value="25.67">

然后加一点造型法宝：

span{
  position:relative;
  margin-right:-20px
}
input[type='number']{
  padding-left:20px;
  text-align:left;
}

Answer 4:

看来，你需要两个字段，一个选择列表中的货币和值的号码字段。

在这种情况下的一种常用技术是使用用于显示一个div或跨度（表单字段屏幕外），并点击开关，以用于编辑的形式的元素。

Answer 5:

该浏览器只允许数值输入，当类型被设置为“数字”。 详情点击此处 。

您可以使用TYPE =“text”和使用JavaScript不是数字输入过滤掉任何其他喜欢这里descripted

文章来源: Set value to currency in