Question

我有两个滑块可更新文本字段中的金额，一个用于金额，一个用于存款。我已经完成了以下工作（我相信这很费劲，并且有更好的方法可以做到）：

var amount = $("input[name='amount']").val();
var amountdiv = amount.substring(1, amount.length);
var depositper = amountdiv / 100 * 20
$(depositper).prepend('&pound;');
$("input[name='deposit']").val(depositper);

但是它只能工作到算出金额字段的20％的程度，因为在设置存款字段之前我似乎无法正确地获得前置部分（substr和prepend是先删除然后重新添加井号）因此数学可能会发生）。我也希望它随着数量字段中值的更新而动态变化-这可能吗？

任何帮助表示赞赏。

Answer 1

您可以仅使用字符串串联或template literals来添加井号。

只要每次金额更改时它都会更改，就可以将“重新计算”放入函数中，并在每次金额值更改时调用该函数。

我已将您的子字符串替换为replace(/#/g, '')，这将删除字符串中的所有井号。使用此方法，如果仅在amount字段中输入数字，则计算将仍然有效。

function calculateDeposit() {
  var amount = $("input[name='amount']").val();
  var amountdiv = amount.replace(/#/g, '');     //remove all # symbols
  var depositper = `#${amountdiv / 100 * 20}`;  //prepend # (see Template Literals documentation above)

  $("input[name='deposit']").val(depositper);
}

$("input[name='amount']").change(calculateDeposit); //When the amount field changes, call calculateDeposit()

input { display: block; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Amount: <input type="text" name="amount" />
Deposit: <input type="text" name="deposit" />

如果您希望每次按键更新存款时都可以，则可以将事件监听器从.change()事件更改为.keyup()事件。

“侦听”滑块/文本字段上的更改并更新第二个文本字段

1 个答案: