javascript - 我是 Javascript 的新手,正在努力让一个简单的表单能够工作。我可以得到一些建议吗?

标签 javascript forms simple-form

我的代码如下。尝试为作业创建一个简单的表单。

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Adoption Form</title>
<script>
function getInfo(){

var first = 
document.forms["formInfo"]["first"].value;
var last = 
document.forms["formInfo"]["last"].value;

var applicantInfo = "My first name is " + first + " My last name is " + last ".";

document.getElementById("info").innerHTML = applicantInfo;

}
</script>
</head>

<body>
    <div>
    <form id="formInfo" name="formInfo">
        <p>My first name is <input name="first" type="text" id="first" title="first"></p>
        <p> My last name is <input name="last" type="text" id="last" title="last"></p>

        <p><input type="button" value="Send Information" onClick="getInfo()"></p>
    </form>
    </div>
    <div id="info">
    </div>
</body>
</html>

每当我按下浏览器中的按钮时,什么也没有发生。我哪里出错了?

最佳答案

有两个错误,首先是 onclick 带有一个小 c,而不是 onClick。 其次,您在 last

之后缺少一个 +

<!DOCTYPE html>
<html lang="en">
  <head>
   <meta charset="UTF-8">
   <title>Adoption Form</title>
    <script>
      function getInfo() {
        var first = document.forms["formInfo"]["first"].value;
        var last = document.forms["formInfo"]["last"].value;

        var applicantInfo =
          "My first name is " + first + " My last name is " + last + ".";

        document.getElementById("info").innerHTML = applicantInfo;
      }
    </script>
  </head>
  <body>
    <div>
      <form id="formInfo" name="formInfo">
        <p>
          My first name is
          <input name="first" type="text" id="first" title="first" />
        </p>
        <p>
          My last name is
          <input name="last" type="text" id="last" title="last" />
        </p>

        <p>
          <input type="button" value="Send Information" onclick="getInfo();" />
        </p>
      </form>
    </div>
    <div id="info"></div>
  </body>
</html>

关于javascript - 我是 Javascript 的新手,正在努力让一个简单的表单能够工作。我可以得到一些建议吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60803173/

相关文章:

javascript - 如何将函数设置为需要匿名函数的属性的值

javascript - 表单提交和功能运行后内容立即消失

ruby-on-rails - jQuery UI slider + Rails + SimpleForm

ruby-on-rails - Rails - 在表单中访问 belongs_to 关联的 foreign_key

css - 垂直简单形式的错误

javascript - 旋转木马 slider 图像不滑动

javascript - document.write 的跨站点脚本问题

javascript - ECharts - 为每个数据点启用工具提示,但跳过 xAxis 标签

javascript - 将 Jquery 函数转换为纯 Javascript

javascript - 通过 Telegram Bot 发送图像