首页 > 解决方案 > html 文件中的表单数据未链接到 .js 文件

问题描述

目标:

  1. 使用 html 创建前端以读取存储在 firebase 数据库中的数据
  2. 在用户提供的日期范围内显示数据
    到目前为止,我已经创建了一个带有表单的 html 文件来收集用户输入(开始和结束日期)。该文件正在使用 tomcat 服务器托管。

如何将我的 .js 链接到我的 .html 文件并检索用户输入?

当我运行此代码时,我看到了 for 并且我能够输入数据。似乎提交按钮未链接。

索引.html

<html>
    <head>
    </head>
    <body>  
    <form id="userForm">
    <h1> Baby Detection In Car </h1>
        Please enter information below.<br/><br/>
        Start Time (mm/dd/yyyy): <input type="text" name="start" id="start"><br>
        End Time (mm/dd/yyyy): <input type="text" name="end" id="end"><br>
        <button type="submit">Submit</button>
        </form> 
        <script src=index.js></script>      
    </body>
</html>

index.js 文件

//Event listener for user input to form 
document.getElementById('userForm').addEventListener('Submit',submitForm); 
function submitForm(e){
    e.preventDefault();
 //Get values 
    var start = getInputVal('start');
    var end = getInputVal('end');
}
//Function to get user input 
function getInputVal(id){
    return document.getElementById(id).value; 
}

标签: javascripthtml

解决方案


经过进一步检查,.js 文件链接正确。一旦按下提交,就没有调用向用户显示数据。


推荐阅读