JavaScript计算赢得'；不要打印结果

我有这个密码

$(function() {
  if(document.getElementById('price') !== null && document.getElementById('dp') !== null){
    var price = document.getElementById('price').value;
    var deposite = document.getElementById('dp').value;
    document.getElementById('remained').value = parseInt(price)-parseInt(deposite);
  }
});

这是我表格中的字段

<div class="col-md-3">
    <label for="price">Price *</label>
    <input type="number" class="form-control" id="price" name="price">
</div>
<div class="col-md-3">
    <label for="dp">DP *</label>
    <input type="number" class="form-control" id="dp" name="dp">
</div>
<div class="col-md-3">
    <label for="remained">Remained *</label>
    <input type="number" class="form-control" id="remained" name="remained">
</div>

价格*
DP*
留下*

逻辑很简单：

获得价格

获得DP

在剩余输入中打印减号结果

但不知何故，它不会在保留的输入中打印任何内容

---

知道我做错了什么吗？

您的代码正在页面加载时执行，输入值为空

您应该在某些事件上执行代码，如下所示：

$（函数（）{
$（'#dp，#price'）。在（'input'，function（）{
if（document.getElementById（'price'）！==null&&document.getElementById（'dp'）！==null）{
var price=document.getElementById（'price'）.value；
var deposite=document.getElementById（'dp'）。值；
document.getElementById（'remained'）。value=parseInt（价格）-parseInt（存款人）；
}
});
});

价格*
DP*
留下*
您的代码在页面加载时执行，输入值为空

您应该在某些事件上执行代码，如下所示：


$（函数（）{
$（'#dp，#price'）。在（'input'，function（）{
if（document.getElementById（'price'）！==null&&document.getElementById（'dp'）！==null）{
var price=document.getElementById（'price'）.value；
var deposite=document.getElementById（'dp'）。值；
document.getElementById（'remained'）。value=parseInt（价格）-parseInt（存款人）；
}
});
});

价格*
DP*
留下*
我认为您应该将计算功能置于就绪状态
因为它是异步的

 $( document ).ready(function() {
     console.log( "ready!" );
     // calculation
  });

或者最好使用角度。。。我认为您应该将计算设置为就绪函数，而不是jQuery
因为它是异步的

 $( document ).ready(function() {
     console.log( "ready!" );
     // calculation
  });

或者最好使用角度。。。而不是jQuery

该计算是正确的，但在page ready事件中不会出现一次

添加手动按钮，告知javascrip何时计算值

alos添加事件侦听器以自动调用更改




该计算是正确的，但在page ready事件中不会出现一次

添加手动按钮，告知javascrip何时计算值

alos添加事件侦听器以自动调用更改



js代码在网页的初始加载上运行。js代码必须由
onclick
或
onkeyup
调用。js代码在初始加载网页时运行。js代码必须由一个
onclick
或一个
onkeyup
调用，这些字段在pageload上没有填充，所以它不总是打印0吗？或者它根本没有在
#remained
中打印任何内容？@CertainPerformance根本没有打印任何内容，我还尝试在console中打印静态文本。log（）在传递空字符串时也没有打印
parseInt
返回
NaN
，并且
NaN
不能设置为数字输入字段的值。不知道为什么要在pageload上检索值，但这没有意义-它们是空的pageload上没有填充字段，所以它不总是打印0吗？或者它根本没有在
#remained
中打印任何内容？@CertainPerformance根本没有打印任何内容，我还尝试在console中打印静态文本。log（）在传递空字符串时也没有打印
parseInt
返回
NaN
，并且
NaN
不能设置为数字输入字段的值。我不知道你为什么要在pageload上检索值，但这没有意义-它们是空的6分钟后可以接受答案请耐心：）6分钟后可以接受答案请耐心：）这是使用按钮的想法，但不幸的是，我对这种情况不感兴趣，并且已经修复，感谢ideathanks@mafortis，如果您需要任何进一步的帮助标记我，这是使用button的想法，但不幸的是，我对这个案例不感兴趣，并且已经修复，感谢ideathanks@mafortis，如果您需要任何进一步的帮助标记我
    $(function() {
      document.getElementById("price").addEventListener("change",cal);
      document.getElementById("dp").addEventListener("change",cal);
    });


    function cal(){
      if(document.getElementById('price') !== null && document.getElementById('dp') !== null){
        var price = document.getElementById('price').value;
        var deposite = document.getElementById('dp').value;
        document.getElementById('remained').value = parseInt(price)-parseInt(deposite);
      }
    }