数学取整并在div中显示

时间:2018-07-12 11:42:36

标签: javascript html

我有一个简单的抵押贷款计算器,我希望最终的贷款利率四舍五入到两位小数。

有可能实现这一目标吗?我不需要JS,但发现可以使用Math.round(value*100)/100,但我不知道如何在我的js中插入此函数以在“#amount2”中显示正确的速率。

这是我的代码,希望有人可以帮助我。谢谢。

$(document).ready(function() {
  function update() {
    $interesseannuo = 1.70;
    $C = $("#amount").val();
    $anni = $("#anni").val();
    $i = $interesseannuo / 12 / 100;
    $n = $anni * 12;
    $amount2 = $C * $i / (1 - Math.pow(1 + $i, -$n));


    $("#amount2").val($amount2);

  }

  debugger;

  $("#slider1").slider({
    max: 200000,
    min: 20000,
    step: 5000,
    slide: function(event, ui) {

      $("#amount").val(ui.value);
      update();

    }
  });





  $("#slider2").slider({
    max: 30,
    min: 10,
    step: 5,

    slide: function(event, ui) {

      $("#anni").val(ui.value);
      update();
    },
  });

  $("#anni").val($("#slider2").slider("value"));

  $("#anni").change(function(event) {
    var data = $("#anni").val();
    if (data.length > 0) {
      if (parseInt(data) >= 0 && parseInt(data) <= 31) {
        $("#slider2").slider("option", "value", data);
      } else {
        if (parseInt(data) < 1) {
          $("#anni").val("1");
          $("#slider2").slider("option", "value", "1");
        }
        if (parseInt(data) > 31) {
          $("#anni").val("31");
          $("#slider2").slider("option", "value", "31");
        }
      }
    } else {
      $("#slider2").slider("option", "value", "1");
    }
  });

  update();
});
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" type="text/css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/jquery-ui.min.js" type="text/javascript"></script>



Totale mutuo (€)
<div id="slider1"></div>
<input type="text" id="amount" value="20000" /><br /><br /> Durata mutuo (anni)
<div id="slider2"></div>


<input type="text" id="anni" value="10" /><br /><br /> la Tua rata
<input id="amount2" type="text" /><br /><br />

2 个答案:

答案 0 :(得分:2)

Phew,在那里。我不得不重写部分代码,缓存jQuery对象等,但是现在它可以工作了,而且更干净。 使用旧版jQuery v1.12(超过2年)的任何原因?

const $amount = $("#amount"),
  $amount2 = $("#amount2"),
  $anni = $("#anni"),
  $slider1 = $("#slider1"),
  $slider2 = $("#slider2");

function update() {
  let interesseannuo = 1.70,
    C = $amount.val(),
    anni = $anni.val(),
    i = interesseannuo / 12 / 100,
    n = anni * 12,
    amount2 = C * i / (1 - Math.pow(1 + i, -n));

  $amount2.val(amount2.toFixed(2));
}

$slider1.slider({
  max: 200000,
  min: 20000,
  step: 5000,
  slide: function(event, ui) {
    $amount.val(ui.value);
    update();
  }
});

$slider2.slider({
  max: 30,
  min: 10,
  step: 5,
  slide: function(event, ui) {
    $anni.val(ui.value);
    update();
  },
});

$anni
  .val($slider2.slider("value"))
  .change(event => {
    var value = parseInt(event.target.value);
    if (value.length) {
      if (value >= 0 && value <= 31) {
        $slider2.slider("option", "value", data);
      } else {
        if (value < 1) {
          $anni.val("1");
          $slider2.slider("option", "value", "1");
        }
        if (value > 31) {
          $anni.val("31");
          $slider2.slider("option", "value", "31");
        }
      }
    } else {
      $slider2.slider("option", "value", "1");
    }
  });

update();
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" type="text/css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/jquery-ui.min.js" type="text/javascript"></script>



Totale mutuo (€)
<div id="slider1"></div>
<input type="text" id="amount" value="20000" /><br /><br /> Durata mutuo (anni)
<div id="slider2"></div>


<input type="text" id="anni" value="10" /><br /><br /> la Tua rata
<input id="amount2" type="text" /><br /><br />

答案 1 :(得分:0)

这可能有效:

Math.round(value*100)/100).toFixed(2);

如果这对您没有帮助,请访问以下链接:Discussion