我为函数的返回值得到一个空字符串

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (24)

当我尝试在另一个函数中使用函数的返回值时,我得到一个空字符串。我将函数值声明为变量,所以我不确定为什么我会这样做。

const fnCalIn = calIn();
const fnCalOut = calOut();

//to get the value in the calIn input field and turn it into a number then print to page
function calIn() {
  var calIn = document.getElementById("calIn").value;
  var clCalIn = Number(calIn);
  document.getElementById("demo-1").innerHTML = clCalIn;
  return clCalIn;
};

//to get the value in the calOut input field and turn it into a number then print to page
function calOut() {
  var calOut = document.getElementById("calOut").value;
  var clCalOut = Number(calOut);
  document.getElementById("demo-2").innerHTML = calOut;
  return calOut;
};

// Where I want to get the difference of the calOut and calIn values and print that to the page
function calDt() {
  var clCalDt = fnCalOut - fnCalIn;
  document.getElementById("calDt").innerHTML = clCalDt;
}

<h1 class="current">Today</h1>
<div>
  <h3>Calories in </h3>
  <input id="calIn">
  <button onclick="calIn()">Get value</button>
  <p id="demo-1"></p>
</div>

<div>
  <h3>Calories Out </h3>
  <input id="calOut">
  <button onclick="calOut()">Get value</button>
  <p id="demo-2"></p>
</div>

<div>
  <h3>Deficit </h3>
  <div>
    <p id="calDt"></p>
    <button onclick="calDt()">Get value</button>
  </div>
</div>

我一直得到0当我将HTML更改为clCalDt时,我应该得到一些值,这取决于我在输入字段中输入的内容但我什么也得不到。当我尝试记录值时,我得到一个空字符串“”。

提问于
用户回答回答于

几个问题。你回来了返回calOut; 并且不返回clCalOut,并且在计算中需要调用函数。可能要检查以确保输入实际上是某个地方的数字。

//to get the value in the calIn input field and turn it into a number then print to page
function calIn() {
  var calIn = document.getElementById("calIn").value;
  var clCalIn = Number(calIn);
  document.getElementById("demo-1").innerHTML = clCalIn;
  return clCalIn;
};

//to get the value in the calOut input field and turn it into a number then print to page
function calOut() {
  var calOut = document.getElementById("calOut").value;
  var clCalOut = Number(calOut);
  document.getElementById("demo-2").innerHTML = calOut;
  return clCalOut;
};

// Where I want to get the difference of the calOut and calIn values and print that to the page
function calDt() {
  var clCalDt = calOut() - calIn();
  document.getElementById("calDt").innerHTML = clCalDt;
}

<h1 class="current">Today</h1>
<div>
  <h3>Calories in </h3>
  <input id="calIn">
  <button onclick="calIn()">Get value</button>
  <p id="demo-1"></p>
</div>

<div>
  <h3>Calories Out </h3>
  <input id="calOut">
  <button onclick="calOut()">Get value</button>
  <p id="demo-2"></p>
</div>

<div>
  <h3>Deficit </h3>
  <div>
    <p id="calDt"></p>
    <button onclick="calDt()">Get value</button>
  </div>
</div>
用户回答回答于

您只在开始时调用函数(fnCalIn和fnCalOut)一次,然后它们的值保持静态,并且页面中的任何更改都不会影响它们。尝试改变

var clCalDt = fnCalOut - fnCalIn;

至:

var clCalDt = calOut() - calIn();

为了重新计算值。

扫码关注云+社区

领取腾讯云代金券