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

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

javascript html

无法获取Javascript变量的表单输入,javascript,html,Javascript,Html,我是Javascript的新手。。。我无法从js变量的输入中获取信息，我参考了这里提出的问题，但仍然无法获取信息。我的代码如下：- <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>JS </title> <body> <form> <input type="text" i

我是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>


JS
提交
函数计算（）{
var amt=document.getElementById（“金额”）.value；
document.getElementById（“TotalAmount”）.innerHTML=amt；
}

您的H1的ID中有一个输入错误。它可能与javascript中的

总量相匹配
H1TotalAmout
中的打字错误应为TotalAmount

调用Calc之前，应先定义Calc

函数计算（）{
var amt=document.getElementById（“金额”）.value；
document.getElementById（“TotalAmount”）.innerHTML=amt；
}
提交


提交
函数计算（）{
var金额=$（“#金额”）.val（）；
$（“总额”）.html（金额）；
}
两件事：

“TotalAmout”和“TotalAmount”中的打字错误
函数需要在调用之前定义

请看这里：

提交
函数计算（）{
var amt=document.getElementById（“金额”）.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>


JS
提交
函数计算（）{
var金额=$（“#金额”）.val（）；
$（“#TotalAmout”）.html（金额）；
}

您还需要在head中添加jquery js
有一个输入错误。这就是问题所在吗
表示的是amout而不是amount.typo，还有一个问题是在调用onclick
后定义了calc。在head中定义脚本非常感谢您的帮助！我试图建立计算器来计算总金额与利率…，我将继续建设。非常感谢你@Marnix@PardeepDhingra它在Jquery或Javascript阻止表单执行的标记之前工作。这里没有必要，因为没有方法属性，但无论如何。。。
<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>

<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>