Question

所以我试图让某人在一个页面上输入他们的名字，然后在另一个页面上输入Hello，entered_name。这就是我所拥有的：第一页：

<!DOCTYPE html>
<html>
<body>
<form action="SecondPage.html">
    <input type="text" id="uname">
</form>
</body>
</html>

第二页：

<html>
<body>
    <script type="text/javascript" src="main.js"></script>
    <script>myFunction();</script>
</body>
</html>

使用Javascript：

function myFunction()
{
    var person = document.getElementById("uname")
    document.write("Hello " + person);
}

输出为Hello null。

有人可以帮我弄清楚如何解决这个问题吗？我是Javascript的新手，我正在尝试学习如何使用外部Javascript。我已经尝试添加$（document）.ready（function（）和下载jquery并将其移动到包含其他文件的文件夹。但我不知道这是否是我必须要做的所以也许这就是问题。我不知道。我也不知道这是否是访问formdata的正确方法。似乎有很多不同的方式，我尝试了一些。

感谢您的任何建议。

Answer 1

您文件中的任何内容实际上都没有将值传递给第二页......它无法执行＆＃34; document.getElementById（＆＃34; uname＆＃34;）＆＃34;因为没有＆＃34; uname＆＃34;在第二页的任何地方。

如果你添加方法=＆＃34; GET＆＃34;到表格，名称=＆＃34; uname＆＃34;对于输入，您将看到它通过URL传递信息。然后你需要找到一些从那里抓取字符串的方法。另一种可能性是将uname存储在cookie中。

Answer 2

这将是一个安全概念：能够访问另一个网页的DOM。提交表单时，参数（uname）将以?name=value&name=value的形式添加到URL中。我们需要获取这些并使用JavaScript解析它们。您还需要在表单标记的第一页上添加method='GET'。

您可以使用https://stackoverflow.com/a/901144/3434588中的这个漂亮的小脚本从第二页的location.query获取值。

function getParameterByName(name, url) {
  if (!url) {
    url = window.location.href;
  }
  name = name.replace(/[\[\]]/g, "\\$&");
  var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"), results = regex.exec(url);
  if (!results) return null;
  if (!results[2]) return '';
  return decodeURIComponent(results[2].replace(/\+/g, " "));
}
var uname = getParameterByName("uname");
console.log(`Hello ${uname}`);

顺便说一句，带有JavaScript的登录网页不会起作用，因为安全性是一个问题。使用像PHP这样的服务器端语言。

Answer 3

您提到您不熟悉JavaScript，因此我将提供此示例，该示例与您所描述的方法紧密相关，但如果您关注安全性，我建议您不要在应用程序中实际使用此示例。此示例使用url散列/查询字符串来传递键值对。我建议你再试一次jQuery设置，这篇文章可能有帮助

Installing jQuery?

第一页

<!DOCTYPE html>
<html>
    <body>
        <form id="myForm" method="GET" action="second.html">
            <input type="text" name="uname"/>
        </form>
    </body>
</html>

第二页

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript">
        window.onload = function() {
            var query = window.location.search.substring(1).split("=");
            var uname = document.getElementById("uname").innerHTML = "Hello " + urldecode(query[1]);
        }

        function urldecode(str) {
           return decodeURIComponent((str+'').replace(/\+/g, '%20'));
        }
    </script>
</head>
<body>
    <span id="uname"></span>
</body>
</html>

这篇文章解释了URI解码 JavaScript URL Decode function

基本的Javascript登录

3 个答案: