JS实现页面跳转参数传递及接收方法

"本文主要探讨了在JavaScript中如何在页面跳转时传递参数，并提供了不同方式的示例。" 在Web开发中，我们经常需要在不同的页面之间传递数据，这通常可以通过URL参数来实现。在JavaScript中，我们可以利用`window.location.href`属性来改变当前页面的URL，从而实现页面跳转并携带参数。以下是一些常见的方法： 1. 通过URL查询字符串传递参数： ```javascript window.location.href = "Default2.aspx?id=111"; ``` 在这个例子中，我们通过在URL后面添加`?id=111`来传递一个名为"id"的参数，其值为"111"。在目标页面（这里是`Default2.aspx`）中，我们可以使用以下代码获取这个参数： ```javascript var userId = location.search.substring(1, location.search.length); ``` `location.search`返回URL中的查询字符串（即`?`后面的部分），`substring(1)`则去掉开头的`?`，获取到实际的参数部分。 2. 使用函数打开新窗口传递参数： ```javascript function openScript(url, width, height) { var win = window.open(url, "openScript", 'width=' + width + ',height=' + height + ',resizable=1,scrollbars=yes,menubar=no,status=yes'); } function openEm() { openScript('UPLOAD.aspx', 450, 300); } ``` 这里定义了一个`openScript`函数，用于打开新窗口，并将参数`url`、`width`和`height`传递给新窗口。在`openEm`函数中，我们调用了`openScript`函数，传入了`UPLOAD.aspx`作为URL，以及窗口的宽度和高度。 3. 在父窗口与子窗口之间传递参数： ```html <input id="Button1" type="button" value="上传图片" class="btn1_mouseover" onClick='window.opener.addNEWS.img.value=Text1.value;window.opener.addNEWS.img1.src=Text1.value;self.close()'/> ``` 这段HTML代码表示一个按钮，当点击时，会将`Text1`元素的值分别赋给父窗口的`addNEWS.img.value`和`addNEWS.img1.src`，然后关闭当前窗口。这种方式适用于有父子窗口关系的场景。 4. 解析URL参数： ```javascript // 解析URL参数 var URLParams = new Array(); var aParams = document.location.search.substr(1).split('&'); for (i = 0; i < aParams.length; i++) { var aParam = aParams[i].split('='); URLParams[aParam[0].toUpperCase()] = aParam[1]; } // 获取特定参数 var n = URLParams["N"]; var m = URLParams["M"]; ``` 这段代码用于解析URL中的所有参数，并将其存储在一个对象`URLParams`中，键是参数名（转换为大写），值是参数值。之后可以使用`URLParams["N"]`和`URLParams["M"]`来获取名为"N"和"M"的参数。 通过这些方法，开发者可以根据需求灵活地在页面跳转时传递参数，实现页面间的数据交互。无论是简单地传递单个参数还是处理复杂的查询字符串，JavaScript都提供了足够的工具来支持。在实际应用中，应根据项目的需求选择合适的方法，并确保参数的安全性，避免敏感信息的泄露。