Question

问题：我试图将函数的返回值传递给输入字段。

我没有错误，该字段只是空白。

问题：为什么我的代码不起作用？

HTML

<tr>
<td>Quantity to be dredged</td>
<td><input type="number"  class="" id="shorePipe"></input></td>
</tr>

的JavaScript

var shorePipe = function() {
  var val = 100;
  var val2 = 100;
  var total = val * val2 / 100;
  // return total;
  document.getElementById('shorePipe').value = total;
};

提前致谢！

Answer 1

由于您的代码完全正常（在</input>旁边），我在此处看到的唯一问题是，一旦 DOM被读取并准备就绪，您可能不会调用shorePipe(); 。

<强> jsBin demo

所以把你的JS放在收尾</body>标签

之前

<script>
var shorePipe = function() {
  var val = 100;
  var val2 = 100;
  var total = val * val2 / 100;
  // return total;
  document.getElementById('shorePipe').value = total;
};
shorePipe();
</script>

</body>

另请注意</input>无效。 <input>位于void elements的组中，不应该有结束标记。

Answer 2

你必须调用函数

shorePipe();

这是一个小提琴：https://jsfiddle.net/2vxdyvgz/

Answer 3

输入不需要自行关闭。
确保你实际上在某个地方调用了你的JS函数。

我为你创建了这个JSFiddle： https://jsfiddle.net/pd12edbp/2/

<input type="number"  class="" id="shorePipe" readyonly>

JS：

var shorePipe = function() {
   var val = 100;
   var val2 = 100;
   var total = val * val2 / 100;
   // return total;
   document.getElementById('shorePipe').value = total;
};

$(document).ready(function(){
    shorePipe();
});

Answer 4

在您的原始帖子中，您将值传递给ID为shorePipe的元素，并且您的输入具有ID avgSubPipe

元素ID必须匹配。你必须解雇这个功能

HTML

<tr>
<td>Quantity to be dredged</td>
<td><input type="number"  class="" id="avgSubPipe" readonly ></td>
</tr>

和Javascript：

var shorePipe = function() {
  var val = 100;
  var val2 = 100;
  var total = val * val2 / 100;
  // return total;
  document.getElementById('shorePipe').value = total;
};

// calling function
shorePipe();

https://jsfiddle.net/yhz7syhs/1/

将值从函数传递到输入字段

4 个答案: