如何从不在服务器上的网页(因此没有服务器端代码)获取用户输入并对其进行处理



我创建了一个HTML表单,我已经让该部分工作了。但是,我不确定如何获取这些信息并实际利用它做点什么。这是针对学校项目,因此无法在 Web 上访问该页面。它只是存储在我的机器上。因此,我在服务器端什么也没发生。我没有使用php或SQL的经验。我对 HTML、C# 和 JavaScript 很熟悉,并且有 Python 和 Java 的经验;但是,我愿意学习我需要的任何东西。

理想情况下,我想要发生的是页面采用用户输入的名称(假设"John Doe")并根据该名称导航到另一个页面(例如 C:\JohnDoe)。我的名字和姓氏是分开请求的,所以它们之间的空格不会有问题。

假设根文件夹上有一个索引.html文件,然后在同一文件夹中有多个用户的html文件(例如:johndoe.html,janedoe.html等),你可以编写一个像这样的javascript代码。缺点是,您必须事先创建所有 html 文件,就像 ivan 所说,您无法仅使用此脚本动态创建所需的文件。

<!DOCTYPE html>
<html>
  <head>
    <title>Homepage</title>
  </head>
  <body>
    <form>
      <input id="firstName" type="text" name="firstName">
      <input id="lastName" type="text" name="lastName">
      <input type="button" onclick="changePage()" value="Click Here">
    </form>
    <script type="text/javascript">
      function changePage() {
        const firstName = document.querySelector('#firstName').value
        const lastName = document.querySelector('#lastName').value
        const fileNameString = firstName+lastName
        window.location.href = fileNameString+'.html';
      }
    </script>
  </body>
</html>

最简单的方法(imo)是通过安装nodejs来使本地机器成为"服务器",您可以通过编写一些javascript来使用它。W3Schools有一个带有示例的教程。你的"服务器"可能只有几行javascript。有一个庞大的工具库可供使用,例如 express,这使得在短时间内实现一个重要的服务器变得容易。许多其他人。不过要小心,你可能会上瘾。

我想说这可能会让你走上一些轨道,我敢肯定,这不是最好的方法,但由于你描述的限制,一些想法。我的想法是将输入中的名称保存到本地存储甚至 Cookie,然后在重定向后将该数据加载到新页面上。但是,我不知道是否有某种方法可以动态"创建"具有该名称的新页面。

function getUser() {
  var username = document.querySelector('#name').value;
  window.localStorage.setItem('name', username);
  window.location.href = "http://stackoverflow.com";
  console.log(username);
}
<input type="text" id="name">
<button type="button" id="nameBtn" onclick="getUser()">Send</button>

最新更新