显示来自表单的名称输入答案

【问题标题】：Displaying Name Input From Form显示来自表单的名称输入
【发布时间】：2017-09-17 18:31:21
【问题描述】：

我试图弄清楚如何让 JavaScript 显示输入到表单元素中的值。

我可能从一开始就做错了，这不是标准的做法，但这是我正在使用的方法。

HTML

<form>
    First name:
    <input type= "text" id="firstname" name="firstname"> <br> <br>
        Last name: <input type= "text" id="lastname" name="lastname" <br> 
        <br> <br>
    <input type = "submit" value="submit">      
</form>

JavaScript

<script>

    function getElementById("firstname") {
        var userName = document.getElementById("firstname")
        document.write("Hello, " + userName);
</script>

【问题讨论】：

你需要了解编写函数和调用现有函数的区别。你应该看一个介绍性的 JS 教程。
你有他们名字的数据库吗？您是否尝试在他们键入时进行更新？你的问题没有意义
您编写此代码的目的是什么？代码似乎没有做任何有意义的事情。
我是编码新手，只是想尝试掌握它，我只想制作一个表单，用户可以在其中输入他们的姓名，代码会显示“你好，+输入”

标签： javascript html input output

【解决方案1】：

选择要读取的元素。 document.getElementById("firstname") 然后使用.value 获取值。
选择要将这些值显示给用户的元素..document.getElementById("show") 并打印值...innerText。
现在将逻辑放在函数showName() 中，并在onclick 提交按钮事件上调用此函数。

function showName(e){
    var firstName= document.getElementById("firstname").value;
    var lastName = document.getElementById("lastname").value;
    document.getElementById("show").innerText = firstName+" "+lastName;        
}

<body>
    <form>
        First name:
        <input type= "text" id="firstname" name="firstname"> <br> <br>
        Last name: <input type= "text" id="lastname" name="lastname"> <br> <br> <br>
        <input type = "button" onclick="showName()" value="submit">
        <span id="show"></span>
    </form>
</body>

【讨论】：

非常感谢，请问函数中的“(e)”与什么有关？
(e) 是事件对象，可以传也可以不传。 e 包含诸如哪个元素调用了该函数、该元素在单击时的默认行为等信息。删除e即可正常使用。