获取查询字符串值并将其显示在我的 html 页面中

Question

重定向到 home.html 页面后，我可以看到我在上一页中给出的查询字符串值。

Home.html?FirstName=dd&LastName=ee&smtButton=Submit

结果如下：

firstname = undefined
lastname = undefined
age = undefined

谁能帮我解决这个问题？

JS：

function getParams() {
    var idx = document.URL.indexOf('?');
    var params = new Array();
    if (idx != -1) {
        var pairs = document.URL.substring(idx + 1, document.URL.length).split('&');
        for (var i = 0; i < pairs.length; i++) {
            nameVal = pairs[i].split('=');
            params[nameVal[0]] = nameVal[1];
        }
    }
    return params;
}

params = getParams();
firstname = unescape(params["firstname"]);
lastname = unescape(params["lastname"]);
age = unescape(params["age"]);
document.write("firstname = " + firstname + "<br>");
document.write("lastname = " + lastname + "<br>");
document.write("age = " + age + "<br>");

Answer 1

在您的函数 function getParams() 中，您被声明为变量 var params = new Array();，我认为这会让您感到困惑

如果找到匹配项，您分配了像params[nameVal[0]] = nameVal[1]; 这样的url 参数，这实际上并没有将值添加到数组对象中。所以 params.length 是 0 。但它可以作为数组是对象的实例 .. 即 params instanceof Object 是 true

所以改为基本对象..以避免混淆

function getParams() {
    var idx = document.URL.indexOf('?');
    var params = {}; // simple js object
    .. here goes other code
}

对象键区分大小写，所以FirstName 可以工作..

firstname = unescape(params["FirstName"]);

打印所有值试试这个

params = getParams();

for( var i in params ){
    console.log( i , params[i] );
}

它会打印出来

FirstName dd    
LastName ee    
smtButton Submit

我已经修改了你的 getParams 代码

function getParams() {

    var params = {},
        pairs = document.URL.split('?')
               .pop()
               .split('&');

    for (var i = 0, p; i < pairs.length; i++) {
           p = pairs[i].split('=');
           params[ p[0] ] =  p[1];
    }     

    return params;
}

Answer 2

您可以使用以下方法将查询字符串从 location.search-string 转换为 js-object：

String.prototype.q2obj = function(){
    var qArr = this.split('&')
        ,qObj = {}
        ,i =-1;
    while(++i<qArr.length) {
            qfrag = qArr[i].split('=');
            qObj[qfrag[0]] = qfrag[1];
   }
   return qObj;
};
//usage
var queryObj = location.search.substr(1).q2obj();