无法执行JavaScript中的功能

Question

我在这个网站上已经找到了很多答案，说实话，我已经看到很多解决我问题的答案，但仍然无法解决。

我想使用输入文本框值并将其放在javascript函数中，然后使用javascript计算我为文本框指定的内容，然后将答案添加到html文档中的另一段中（在这种情况下，我想使用kmh=ms*3.6用return做计算）
这是我的功能代码：

function msToKM() {document.getElementById('mstokm').innerHTML='<input type="text" name="mstokm" id="mstokmh" value="10"/>m/s<br><br><button type="button" class="buttons" onclick="convMSKM()" style="padding: 10px 10px;">Equals to!</button>';} 
function convMSKM () {mstokm= document.getElementById('mstokmh'); mstokmA(mstokm);}
function mstokmA(ms) {return kmh= ms*3.6; document.getElementById('AmstokmA').innerHTML=kmh;}

我特别对这部分代码有疑问：

function mstokmA(ms) {return kmh= ms*3.6; document.getElementById('AmstokmA').innerHTML=kmh;}

因为它没有执行它的最后一部分。
如果需要，我也可以提供html代码。

我怎样才能解决这个问题？

Answer 1

return语句使函数停止执行，因此正在发生的事情是您正在返回值，并且永远无法在元素内设置该值。 您可以执行以下操作：

mstokmA(ms) {
  document.getElementById('AmstokmA').innerHTML = ms*3.6;
}

或更像您尝试做的那样：

mstokmA(ms) {
  var kmh = ms*3.6; // set value inside variable
  document.getElementById('AmstokmA').innerHTML = kmh; // append that value to the element
}

我更喜欢第一种选择。 希望对您有所帮助；）。

注意：在这种情况下，无需返回。

Answer 2

这是一个演示方法

好吧，与onclick事件相比，我正在选择输入字段的值，而不是在控制台中打印结果。 您可以将其放置在所需的任何元素上，而不必打印到控制台。

 function handle(){ let val = document.getElementById('userIn').value; console.log(3.6*val) } 

 <input type='text' value='' id='userIn'/> <button onclick='handle()'>calculate</button> 

Answer 3

将return语句保留在原处，但将“ return”替换为“ let”。

例：

function mstokmA(ms) {let kmh= ms*3.6; document.getElementById('AmstokmA').innerHTML=kmh;}