logo标签列表

在 jQuery 中从一个页面传递和检索多个参数到另一个页面

jqueryvariablesparametersnavigationwinjs
4
我想使用jQuery在WinRT应用程序中从一个页面传递4个名称到另一个页面。已经使用一个参数完成了这个过程。如何传递多个参数并在第二个页面中检索？
下面是一个参数的编码。
default.html:
<html>
<head>
<script>
       $(document).ready(function () {
        $(function () {
            $('#navigate12').click(function () {
                var te = $("#text1").val();
                var tea = $("#text2").val();
                 window.location.href = "/page.html?cal=" + te; 
                   });
        });});
</script>
</head>
<body>
 <button id="navigate12">navigate</button>
 <input id="text1" type="text"/>
 <input id="text2" type="text"/>
 <input id="text3" type="text"/>
 <input id="text4" type="text"/>
</body>
</html>

 page.html
<html>
<head>
      <script src="/js/jquery-1.9.1.js"></script>
      <script>
              $(document).ready(function () {                  
                function qs() {
                var qsparam = new Array();
                var query = window.location.search.substring(1);
                var parms = query.split('&');
                for (var i = 0; i < parms.length; i++) {
                    var pos = parms[i].indexOf('=');
                    if (pos > 0)
                    {
                        var key = parms[i].substring(0, pos);
                        var val = parms[i].substring(pos + 1);
                        qsparam[key] = val;
                    }

                }
               var msg = new Windows.UI.Popups.MessageDialog(val);
               msg.showAsync();
             } 
               var splitstr = qs();
                    });
</script>
<title>
</title>
</head>
<body>

</body>
</html>
请注意，当您不使用导航框架而使用window.location时，会丢失导航状态并且页面之间没有转换效果。导航框架还可以存储页面之间传递的值。您为什么不使用它呢？ - Adam Tuliper
4个回答
11

你可以使用"?param=foo"为第一个参数将GET参数传递到页面。其他参数应该用"&"而不是"?"来包含。

由于你正在传递GET参数，因此你可以将它们全部放在URL中并在目标页面中读取它们。或者，你也可以使用POST参数。

这里有一个关于GET和PUT参数的参考资料:

http://www.w3schools.com/tags/ref_httpmethods.asp

如果你要将所有参数作为GET传递，可以扩展这个部分:

var te = $("#text1").val();
var tea = $("#text2").val();
window.location.href = "/page.html?cal=" + te;

变成这样：

var te = $("#text1").val();
var text2 = $("#text2").val();
var text3 = $("#text3").val();
var text4 = $("#text4").val();
window.location.href = "/page.html?cal=" + te + "&text2=" + text2 + "&text3=" + text3 + "&text4=" + text4;

关于获取另一个页面中的参数：我假设你想通过 jQuery 获取其他页面中的 GET 参数，因为你的目标页面是纯 HTML。如果是这种情况，请查看此问题。

8

在default.html中使用此技术完成

$(function () {
               $('#navigate12').click(function () {
                var te = $("#text1").val();
                var text2 = $("#text2").val();
                var text3 = $("#text3").val();
                var text4 = $("#text4").val();
                window.location.href = "/page.html?cal=" + te + "&text2=" + text2 +
               "&text3=" + text3 + "&text4=" + text4; <-- this line has changes to include multiple parameters rest is same as in the question

并且在page.html页面中

    <script>
              $(document).ready(function () {                  
              function qs() {
                var qsparam = new Array(10);
                var query = window.location.search.substring(1);
                var parms = query.split('&');
               for (var i = 0; i < parms.length; i++) {
               var pos = parms[i].indexOf('=');
               if (pos > 0)
              {
                        var key = parms[i].substring(0, pos);
                        var val = parms[i].substring(pos + 1);
                        qsparam[i] = val;    
              }                          
                                                       }
               text1.value = qsparam[0];
               text2.value = qsparam[1];
               text3.value = qsparam[2];
               text4.value = qsparam[3];



              }
              var splitstr = qs();



                    });
    </script>
    <title></title>
</head>
<body>
   <input id="text1" type="text" />
    <input id="text2" type="text" />
   <input id="text3" type="text" />
    <input id="text4" type="text" />
 </body>
 </html>

我们正在使用函数qs()，调用方法如下：

var splitstr = qs();

它可以分离参数，并且您可以使用text1.value=parms来查看不同变量的值。如果有疑问，请随时询问 :-)
0

发送以下值

window.location.href = "testlocation.aspx?Id=" + tickerCode.label + "&Id2=" + financialYear.label;

并且接收到如下内容..

function getActualYear() {
    var Id = getParameterByName('Id');
    var Id2 = getParameterByName('Id2');
    console.log('Id=' + Id);
    console.log('Id2=' + Id2);
}

function getParameterByName(id) {
    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
    results = regex.exec(location.search);
    return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
这里我提到了window.location.href方法的发送和接收参数。 - Mohit Jariwal
将函数的输入参数从“id”更改为“name”。您会误导人们。 - Amin Setayeshfar
0

这里有一个详细的答案，介绍了如何使用jQuery或不使用jQuery从查询字符串中检索参数的不同方法：

如何在JavaScript中获取查询字符串值？

例如：

function getParameterByName(name) {
    name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
    return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接