如果有人可以帮助我解决AutoNumeric.js的简单应用程序,我将非常乐意。我有以下代码:
小提琴链接:https://jsfiddle.net/yu1s9nrv/8/
<table id="shareInput" class="table_standard">
<tr>
<th>Name</th>
<th>Quantity</th>
<th>Price</th>
<th>Growth</th>
<th>Yield</th>
</tr>
<tr>
<td><input type="text" class="input_field_large" id="shareName" value=""></td>
<td><input type="text" class="input_field_medium_num" id="shareQty" value=""></td>
<td><input type="text" class="input_field_medium_dollar" id="sharePrice" value=""></td>
<td><input type="text" class="input_field_medium_pct" id="shareGrowth" value=""></td>
<td><input type="text" class="input_field_medium_pct" id="shareYield" value=""></td>
</tr>
<tr>
<td><input type="text" class="input_field_large" id="shareName" value=""></td>
<td><input type="text" class="input_field_medium_num" id="shareQty" value=""></td>
<td><input type="text" class="input_field_medium_dollar" id="sharePrice" value=""></td>
<td><input type="text" class="input_field_medium_pct" id="shareGrowth" value=""></td>
<td><input type="text" class="input_field_medium_pct" id="shareYield" value=""></td>
</tr>
</table>
<script>
window.onload = function() {
const anElement = new AutoNumeric('.input_field_medium_pct', 0, {
suffixText: "%"
});
};
</script>
我期望的输出是对于具有input_field_medium_pct类的所有字段具有所需的AutoNumeric格式,但是它仅格式化该类的第一个字段。该文档的内容如下:
// AutoNumeric构造函数类也可以接受字符串作为CSS
选择器。在后台使用
QuerySelector
并将其自身限制为仅找到的第一个元素。 anElement =新
AutoNumeric('。myCssClass>输入'); anElement =新
AutoNumeric('。myCssClass> input',{选项});
取自:https://github.com/autoNumeric/autoNumeric#initialize-one-autonumeric-object
我是JS的新手,并且发现AutoNumeric文档说明有些混乱,是否有人遇到过此问题或是否能够弄清为什么会这样?提前致谢。
最佳答案
您需要使用Autonumeric.multiple
一次将其应用于多个元素。
const anElement = AutoNumeric.multiple('.input_field_medium_pct', 0, {
suffixText: "%"
});
检查working jsfiddle
另外,请查阅文档https://github.com/autoNumeric/autoNumeric#initialize-multiple-autonumeric-objects-at-once