javascript - 确定带小数点和不带小数点的价格

Question

我的一些代码有一个小问题，它可以工作，但也不是我想要的方式。

$('.prices').on('change', function() {
  var elm = $(this).val();
  var value = (elm) ? elm.replace(/\D/, '') : '0';
  $(this).val(($('#amountDeposit').val() == 2) ? parseFloat(value).toFixed(2) : value);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div class="row">
  <div class="col-md-4">
    <select id="amountDeposit" name="amountDeposit" class="form-control">
      <option value="1">Percentage</option>
      <option value="2">Fixed Amount</option>
    </select>
  </div>
  <div class="col-md-4">
    <input type="text" name="valueDeposit" class="form-control prices" value="0">
  </div>
</div>

选择框中有2个值，百分比和固定金额。如果是固定金额，则价格需要保留 2 位小数。

如果选择固定金额，并且您输入 20 - JQuery 会将其更改为 20.00 - 但如果您输入 20.00，则 JQuery 会将其更改为 2000.00 - 替换的想法是删除用户可以输入的任何符号，如 £ 或 % .

我试过将 parseFloat 放入 elm - 但是当值中有符号时它会出错。

Answer 1

您可以使用正则表达式 /\d+(.\d+)?/ 从用户输入中提取十进制数。除了十进制数字之外的任何其他内容都将被安全删除。然后，您可以在匹配时使用 parseFloat。

试试这个

$('.prices').on('change', function() {
  var elm = /\d+(.\d+)?/.exec($(this).val());
  var value = elm ? elm[0] : '0';
  $(this).val(parseFloat(value).toFixed(2));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div class="row">
  <div class="col-md-4">
    <select id="amountDeposit" name="amountDeposit" class="form-control">
      <option value="1">Percentage</option>
      <option value="2">Fixed Amount</option>
    </select>
  </div>
  <div class="col-md-4">
    <input type="text" name="valueDeposit" class="form-control prices" value="0">
  </div>
</div>

编辑

如果 $(#amountDeposit) 设置为 Percentage，您不想允许 float ，因此请使用下面的代码片段。

$(this).val(parseFloat(value).toFixed($('#amountDeposit').val() == 2 ? 2 : 0));