Question

我的目标是使用GET或POST将在Firstpage.html中输入的值打印到basicform.html。

我只需要使用Html和JavaScript或Ajax来完成它。

Firstpage.html的代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function result()
{

      var x=document.forms["fom"]["name"].value;

     $_GET[0]=x;
}

</script>
</head>

<body>
<form method="get"  action="basicform.html" name="fom">
Your name: <input type="text" id="name" name="name" size="25" /> <br />

<input type="submit" value="submit" onclick="result()"  />
</form>
</body>
</html>

这是basicform.html中的代码

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>


<script>
function loaad()
{
    var name = $_GET[x];
    if(isset($_get(submit)))
    {
        document.write(name);
    }

}
</script>
<body onload="loaad();">
</body>
</html>

Answer 1

如果你想从Javascript获取GET参数，请使用以下函数：

function getUrlParameter(sParam)
{
    var sPageURL = window.location.search.substring(1);
    var sURLVariables = sPageURL.split('&');
    for (var i = 0; i < sURLVariables.length; i++) 
    {
        var sParameterName = sURLVariables[i].split('=');
        if (sParameterName[0] == sParam) 
        {
            return sParameterName[1];
        }
    }
}

参考： Get url parameter jquery Or How to Get Query String Values In js

然后只需使用：

var name = getUrlParameter('x');
//assuming url: http://yoursite.copm/?x=test
document.write(name);

Answer 2

您只能使用JavaScript获取GET参数。如果JavaScript能够访问post变量，则会产生安全风险。这就是使用JS获得 GET 参数的方法。

var $_GET = {}, args = location.search.substr(1).split(/&/);
for (var i=0; i<args.length; ++i) {
    var tmp = args[i].split(/=/);
    if (tmp[0] != "") {
        $_GET[decodeURIComponent(tmp[0])] = decodeURIComponent(tmp.slice(1).join("").replace("+", " "));
    }
}

Answer 3

您的表单使用get发送数据（与PHP的$_GET不同）。这意味着发送的值将显示在表单发送到的网页的地址中 - 此页面上不需要JS。例如，在提交firstpage.html表单时，您可以访问：

 basicform.html?name=Bob

这很有效，因为JavaScript可以获取这些参数（不是很干净，但它可以）。把它放在basicform.html上：

function getQueryParams(qs) {
  qs = qs.split("+").join(" ");

  var params = {}, tokens,
      re = /[?&]?([^=]+)=([^&]*)/g;

  while (tokens = re.exec(qs)) {
      params[decodeURIComponent(tokens[1])]
          = decodeURIComponent(tokens[2]);
  }

 return params;
}

var query = getQueryParams(document.location.search);

然后，您将使用query变量打印出名称值。

document.write(query.name);

来自here on SO的getQueryParams函数。

，使用$_GET导致错误的原因是formed like any other valid JavaScript variable name。但是，它只是 - 与任何JS变量相同 - 并且与PHP的$_GET变量无关。

Answer 4

我使用localStorage成功完成了任务。

Firstpage.html的代码

<script>
function store()
{

    if(localStorage)
    {

        document.getElementById("contactForm").addEventListener("submit",


        function()
        {
            var name = document.getElementById("name").value;

            localStorage.setItem('name',name);

            var age = document.getElementById("age").value;
            localStorage.setItem('age',age);

        })


    }

}

</script>
</head>

<body>
<form id="contactForm" action="result.html" method="POST" >

    <label for="name">Name</label>
    <input type="text" name="name" id="name">

    <label for="Age">Age</label>
    <input type="text" name="age" id="age"> 

    <input type="submit" value="send" onclick="store()">

</form>
</body>

并且result.html是

<script>
window.onload= function()
{
    var x =localStorage.getItem('name');
    var y=localStorage.getItem('age');
    if((x !="undefined") || (x!="NULL"))
    {
        document.getElementById("ret").innerHTML="hello "+x+"  your are  "+y+"  years old";

    }
}
</script>
</head>

<body>
<div id="ret"    style="position:absolute; left:400px; top:200px; height:400px; width:400px; text-align:center">
Result
</div>
</body>

使用GET或POST打印值

4 个答案: