JS如何完成页面携参数跳转

问题：html二跳携带参数跳转
初始页面：A
一跳页面：B
二跳页面：C
A页面网址：www.123.com/?clickId=123&qz_gdt=123
现在的情况是
点击A后B页面自动携带/?clickId=123&qz_gdt=123这个参数
跳转后的B页面网址为:http://www.456.com/?clickId=123&qz_gdt=123
遇到的问题:
如何让B页面自动跳转到C页面后，C页面网址带B页面网址的参数值！
跳转顺序：A点击→B自动跳转→C

在B页面的HTML中，添加以下JavaScript代码来获取URL参数：

<script>
  // 函数用于获取URL参数
  function getUrlParameter(name) {
    name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
    var regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
    var results = regex.exec(location.search);
    return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '));
  }

  // 获取参数值
  var clickId = getUrlParameter('clickId');
  var qz_gdt = getUrlParameter('qz_gdt');

  // 构建新的URL并跳转到C页面
  var redirectTo = 'http://www.example.com/C.html?clickId=' + clickId + '&qz_gdt=' + qz_gdt;
  window.location.href = redirectTo;
</script>

替换上述代码中的http://www.example.com/C.html为实际的C页面的URL。

将上述代码添加到B页面的HTML中，确保它在B页面加载时立即执行。这样，当用户访问B页面时，它会自动获取A页面传递的参数，并将这些参数携带到C页面的URL中，然后将用户重定向到C页面。

可以把参数存储在localstorage里面，在跳转的时候携带相应参数即可。

引用皆我百晓生小程序回复内容作答：

在 JavaScript 和 HTML 中，你可以使用以下方法实现页面跳转并携带参数。

在 A 页面的点击事件中，你可以使用 window.location.href 将页面重定向到 B 页面，并将参数附加到 URL 后面。

// A 页面的点击事件
function redirectToB() {
  var clickId = "123";
  var qz_gdt = "123";
  var url = "http://www.456.com/?clickId=" + clickId + "&qz_gdt=" + qz_gdt;
  window.location.href = url;
}

在 B 页面加载时，你可以从 URL 中获取参数值，然后通过 JavaScript 将参数值传递给 C 页面。

// B 页面加载时获取参数值
window.addEventListener('DOMContentLoaded', function() {
  var params = new URLSearchParams(window.location.search);
  var clickId = params.get('clickId');
  var qz_gdt = params.get('qz_gdt');
  
  // 通过 JavaScript 将参数传递给 C 页面
  redirectToC(clickId, qz_gdt);
});

// B 页面中的跳转函数
function redirectToC(clickId, qz_gdt) {
  var url = "http://www.789.com/?clickId=" + clickId + "&qz_gdt=" + qz_gdt;
  window.location.href = url;
}

这样，在 A 页面点击后，页面会自动重定向到 B 页面并携带参数。然后，在 B 页面加载时，会从 URL 中获取参数值，再通过 JavaScript 将参数值传递给 C 页面，实现 B 页面到 C 页面的自动跳转并携带参数。

请注意，在实际应用中，你可能需要进行一些参数有效性验证和 URL 编码处理，以确保跳转和参数传递的准确性和安全性。

B页面点击执行跳转的方法中，先通过 location.search 获取当前B页面的查询字符串，然后再拼接到要跳转的 C 页面的网址后面就行了。不过一般来说在你的 B 页面中都会获取使用 A 传过来的 clickId 和 qz_gdt 参数的吧，然后再往C传。

结合GPT给出回答如下请题主参考
可以使用JavaScript的location对象的search属性来完成页面携带参数跳转。具体实现步骤如下：

在A页面的按钮点击事件中，使用window.location.href属性将页面跳转到B页面，并携带参数。

// 获取参数
var clickId = '123';
var qz_gdt = '123';

// 构造URL
var url = 'www.123.com/?clickId=' + clickId + '&qz_gdt=' + qz_gdt;

// 跳转页面
window.location.href = url;

在B页面的JavaScript中，使用location对象的search属性获取跳转链接中的参数，并将参数保存起来。

// 获取URL中的参数
var search = window.location.search;

// 解析参数
var params = {};
if (search) {
  var urlParams = search.split(/[?&]/);
  urlParams.shift();
  for (var i = 0; i < urlParams.length; i++) {
    var param = urlParams[i].split('=');
    params[param[0]] = decodeURIComponent(param[1]);
  }
}

// 保存参数
var clickId = params.clickId;
var qz_gdt = params.qz_gdt;

在B页面中跳转到C页面时，将参数携带到跳转链接中。

// 构造URL
var url = 'C页面地址?clickId=' + clickId + '&qz_gdt=' + qz_gdt;

// 跳转页面
window.location.href = url;

为什么不直接跳到 C 页面，是需要在 B 页面做处理吗？

可不可以直接跳C呢

引用chatgpt内容作答：
要实现从页面A点击跳转到页面B，然后自动跳转到页面C，并且在B页面和C页面都携带A页面的参数，你可以使用JavaScript来实现这个逻辑。以下是一个可能的解决方案：

首先，在B页面的JavaScript中，你可以从URL中获取A页面传递的参数，然后构建包含这些参数的URL，然后使用 window.location.href 跳转到C页面。

在B页面的HTML中，添加以下JavaScript代码：

<script>
// 获取A页面传递的参数
const urlParams = new URLSearchParams(window.location.search);
const clickId = urlParams.get("clickId");
const qz_gdt = urlParams.get("qz_gdt");

// 构建C页面的URL，包含参数
const cPageUrl = `http://www.789.com/?clickId=${clickId}&qz_gdt=${qz_gdt}`;

// 自动跳转到C页面
window.location.href = cPageUrl;
</script>

这段代码首先从B页面的URL中提取了A页面传递的参数，然后构建了C页面的URL，将这些参数添加到URL中，最后使用 window.location.href 跳转到C页面。

这样，当从A页面点击跳转到B页面时，B页面会自动跳转到C页面，并且C页面会携带来自A页面的参数。

这个问题可以通过在B页面使用JavaScript来实现。在B页面加载的时候，我们可以获取URL中的参数，然后设置一个新的超链接，指向C页面并附带这些参数。

假设B页面可以获取URL中的参数（这需要服务器端的支持），那么代码可能如下：

// 获取URL中的参数
var clickId = GET_URL_PARAM('clickId');
var qz_gdt = GET_URL_PARAM('qz_gdt');

// 创建一个新的链接，指向C页面并附带参数
var cPageUrl = "http://www.789.com/?clickId=" + clickId + "&qz_gdt=" + qz_gdt;

// 创建一个新的元素，用于跳转
var a = document.createElement('a');
a.href = cPageUrl;
a.click();

其中，GET_URL_PARAM是一个自定义函数，用于获取URL中的参数，实现可能如下：

function GET_URL_PARAM(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
    var r = window.location.search.substr(1).match(reg);
    if (r != null) return unescape(r[2]); return null;
}

注意这种方法的一个限制是，它依赖于JavaScript，如果用户禁用了JavaScript，这种方法将不起作用。同时，如果B页面和C页面不在同一个域中，可能会遇到跨域问题。

1、定义获取参数出数


function GetRequest(){  
    var url = location.search; //获取url 
    var theRequest = new Object();  
    if (url.indexOf("?") != -1) {  
        var str = url.substr(1);  
        strs = str.split("&");  
        for (var i = 0; i < strs.length; i++) {  
            theRequest[strs[i].split("=")[0]] = (strs[i].split("=")[1]);  
        }  
    }  
    return theRequest;  
}

2、获取B页面参数
var clickId= GetRequest().clickId;
var qz_gdt= GetRequest().qz_gdt;
3、页面跳转
window.location.href = “c页面网址?clickId=”+ clickId+"&qz_gdt="+qz_gdt

该回答通过自己思路及引用到GPTᴼᴾᴱᴺᴬᴵ搜索,得到内容具体如下：
要实现这个功能，可以在A页面中通过JavaScript获取URL参数，然后将参数值传递给B页面。在B页面中接收参数值后，再将参数值传递给C页面。具体操作如下：
1、在A页面中，使用JavaScript获取URL参数clickId和qz_gdt的值：

function getQueryVariable(variable) {
    var query = window.location.search.substring(1);
    var vars = query.split("&");
    for (var i = 0; i < vars.length; i++) {
        var pair = vars[i].split("=");
        if (pair[0] == variable) {
            return pair[1];
        }
    }
    return false;
}
var clickId = getQueryVariable("clickId");
var qz_gdt = getQueryVariable("qz_gdt");

2、将获取到的参数值存储在localStorage中：

localStorage.setItem("clickId", clickId);
localStorage.setItem("qz_gdt", qz_gdt);

3、在B页面中，从localStorage中获取参数值，并将参数值添加到跳转链接中：

<a href="http://www.456.com" onclick="redirectToC()">跳转到C页面</a>

<script>
function redirectToC() {
    var clickId = localStorage.getItem("clickId");
    var qz_gdt = localStorage.getItem("qz_gdt");
    window.location.href = "http://www.456.com?clickId=" + clickId + "&qz_gdt=" + qz_gdt;
}
</script>

4、在C页面中，同样使用JavaScript获取URL参数clickId和qz_gdt的值，并将参数值添加到跳转链接中：

<a href="http://www.789.com" onclick="redirectToB()">跳转到B页面</a>

<script>
function redirectToB() {
    var clickId = localStorage.getItem("clickId");
    var qz_gdt = localStorage.getItem("qz_gdt");
    window.location.href = "http://www.789.com?clickId=" + clickId + "&qz_gdt=" + qz_gdt;
}
</script>

这样，当从A页面跳转到B页面后，再跳转到C页面时，C页面的URL会携带B页面的参数值。

如果以上回答对您有所帮助，点击一下采纳该答案～谢谢