无法获取Javascript变量的表单输入

Unable to get form input to Javascript variable

本文关键字:表单 输入 变量 Javascript 获取      更新时间:2023-09-26

我是Javascript的新手。。。并且我无法从输入中获取js变量,我参考了之前在这里提出的问题,仍然无法获取信息。我的代码如下:-

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>JS </title>
<body>
    <form>
    <input type="text" id="amount" placeholder="Amount">
    <button type="button" onclick="calc()">Submit</button>
    </form>
    <h1 id="TotalAmout"></h1>
    <script>
        function calc() {
    var amt = document.getElementById("amount").value;
    document.getElementById("TotalAmount").innerHTML = amt;
    }
    </script>
</body>
</html>
  1. H1 TotalAmout中的打字应为TotalAmount

  2. Calc应该在调用之前定义。Fiddle

    <head>
      function calc() {
        var amt = document.getElementById("amount").value;
        document.getElementById("TotalAmount").innerHTML = amt;
      }
    </head> 
    <body>
      <form>
        <input type="text" id="amount" placeholder="Amount">
        <button type="button" onclick="javascript:calc()">Submit</button>
      </form>
     <h1 id="TotalAmount"></h1>
    </body>
    

H1的ID中有一个拼写错误。它可能与javascript中的TotalAmount匹配。

两件事:

  • "TotalAmout"answers"TotalAmount"中的拼写错误
  • 函数需要在调用之前进行定义

请参见此处:https://jsfiddle.net/zLguL6fu/:

<form>
  <input type="text" id="amount" placeholder="Amount">
  <button type="button" onclick="calc(); return false;">Submit</button>
</form>
<h1 id="TotalAmount"></h1>
function calc() {
   var amt = document.getElementById("amount").value;
   document.getElementById("TotalAmount").innerHTML = amt;
 }

请使用此代码。

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>JS </title>
    <script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
</head>
<body>
    <form>
    <input type="text" id="amount" placeholder="Amount">
    <button type="button" onclick="calc()">Submit</button>
    </form>
    <h1 id="TotalAmout"></h1>
    <script>
        function calc() {
            var amt = $("#amount").val();
            $("#TotalAmout").html(amt);
        }
    </script>
</body>
</html>

您还需要在头中添加jquery js

<form>
<input type="text" id="amount" placeholder="Amount">
<button type="button" onclick="calc();return false">Submit</button>
</form>
<h1 id="TotalAmout"></h1>
<script>
    function calc() {
var amt = $("#amount").val();
$("TotalAmount").html(amt);
}
</script>