如何将html输入绑定到我的javascript函数中？

<!DOCTYPE html> 
<html> 


    <body> 
     <form> 
      Birth Year:<br> 
      <input type="number" name="birthYear"> 
      <br> 
      Current Year:<br> 
      <input type="number" name="currentYear"> 
     </form> 
     <button onclick="calculateAge()">Calculate Age</button> 
     <div id="output"></div> 

      <script> 
      function calculateAge(ghF, xhF) { 
      var ghF = "birthYear" 
      var xhF = "currentYear" 
      return (xhF - ghF); 
      } { 
      document.getElementByID("output").innerHTML = text; 
      }; 
      </script> 
    </body>

当我按一下按钮就应该打印出“你是X时代”。我会在哪里添加该文本？目前没有任何反应，当我点击按钮。

来源

2016-01-31 Phillip Smith

getElementById将返回具有id作为所述参数的DOM元素。 .value是input元素的属性，它将给出值input 而不是返回值，您必须设置innerHTML/innerText减法后。

注：必须分配唯一id属性的元素来获取DOM元素。

function calculateAge() { 
 
    var ghF = document.getElementById("birthYear").value; 
 
    var xhF = document.getElementById("currentYear").value; 
 
    document.getElementById("output").innerHTML = xhF - ghF; 
 
}

<form> 
 
    Birth Year: 
 
    <br> 
 
    <input type="number" name="birthYear" id="birthYear"> 
 
    <br>Current Year: 
 
    <br> 
 
    <input type="number" name="currentYear" id="currentYear"> 
 
</form> 
 
<button onclick="calculateAge()">Calculate Age</button> 
 
<div id="output"></div>

来源

2016-01-31 14:05:19 Rayon

function calculateAge() { 
      var ghF = document.getElementById("birthYear").value; 
      var xhF = document.getElementById("currentYear").value; 
document.getElementById("output").innerHTML="You are " +(xhF - ghF) + " age"; 
      }

EXAMPLE

来源

2016-01-31 14:05:59 brk

功能被严重地形成。

这将这样的伎俩：

function calculateAge() { 
 
     var ghF = document.querySelector('[name="birthYear"]').value; 
 
     var xhF = document.querySelector('[name="currentYear"]').value; 
 
     document.getElementById("output").innerHTML = "You are "+(xhF - ghF)+" age"; 
 
    }

<form> 
 
    Birth Year: 
 
    <br> 
 
    <input type="number" name="birthYear"> 
 
    <br> 
 
    Current Year: 
 
    <br> 
 
    <input type="number" name="currentYear"> 
 
</form> 
 
<button onclick="calculateAge()">Calculate Age</button> 
 
<div id="output"></div>

来源

2016-01-31 14:07:40 Filipe

如何将html输入绑定到我的javascript函数中？

回答

相关问题