为什么获胜't添加的电子邮件地址显示在messageBox中

why won't the added email address display in the messageBox?

本文关键字：显示 电子邮件地址 messageBox 添加 获胜 为什么      更新时间：2023-09-26

我有一个html文件：

    <!DOCTYPE html>
<html>
<head>

<link rel="stylesheet" type="text/css" href="C:'Users'matthew'AppData'Local'Temp'fz3temp-1'email picker.css"> 
<script src="email picker.js" type="text/javascript"></script>
</head>
<body>
    <div id="main">
        <form>
        <h4>Enter the email addresses in the input box below</h4>
            email:<input id="emailIn" type="text" placeholder=" email" />
            <input type="submit" value="Show entry" onsubmit="insert()" />
        </form>
        <div id="display"></div>
    </div>
</body>
</html>

和一个javascript文件：

    var entries = [];
    var emailInput = document.getElementById("emailIn");
    var messageBox = document.getElementById("display");
    function insert() {
        entries.push(emailInput.value);
        clearAndShow();
    };
    function clearAndShow() {
    emailInput.value = "";
    messageBox.innerHTML = "";
      messageBox.innerHTML += "Emails: " + entries.join(", ") + "<br/>";
    };

和一个简单的.css文件。

当我在浏览器中运行代码时，不会显示最后一封电子邮件输入。我错过了什么？非常感谢您的帮助。

您的问题是您提交了表单，因此页面被重置（而且您无论如何都不绑定insert函数，因为输入没有接收到submit事件）。

您可以更换

        <input type="submit" value="Show entry" onsubmit="insert()" />

带有

        <input type="button" value="Show entry" onclick="insert()" />
相关文章：