JavaScript的url带参数问题

最新推荐文章于 2025-07-13 19:34:48 发布

原创最新推荐文章于 2025-07-13 19:34:48 发布 · 1.2k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#JS #URL

JavaScript 专栏收录该内容

3 篇文章

订阅专栏

本文介绍如何在JS中通过URL传递参数，并在目标页面中接收和使用这些参数。具体步骤包括在链接中添加参数，使用JavaScript从URL中解析参数，以及将参数值赋给页面元素。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

文章目录

1.js的url带参数：
- <1>首先，url传参：
- <2>然后，定义一个变量接收参数：

1.js的url带参数：

这样一个需求：在一个layui的表格里的操作栏按钮，点击跳转按钮跳转到一个带有搜索按钮的页面，搜索是有很多条件的，需要在前一个页面把搜索条件之一的账单编号得值带过来并给input赋值。如下图：

在这里插入图片描述

<1>首先，url传参：

<a class="layui-btn layui-btn-green layui-btn-xs" href="/pages/create.html?id={{uid}}">跳转</a>

其次，跳转到的页面接收参数：

function getQueryVariable(variable) {			//variable是传来的key，如id
    var query = window.location.search.substring(1);  //取到?之后的值 id=123456&name=haha
    var myArray = query.split("&");     		//以&分隔字符串，获得类似id=123456这样的元素数组(因为多个参数是以&连接的)，得到 ["id=123", "name=haha"]
    for (var i = 0; i < vars.length; i++) {		//循环这个数组
        var pair = myArray[i].split("=");		// 将每一个数组元素以=分隔并赋给obj对象["id", "123"]
        if (pair[0] == variable) {				//如果数组中的第一个值和拿到的key值一样
            return pair[1];					//就return出数组中的第二个值，也就是之前的value
        }
    }
}

<2>然后，定义一个变量接收参数：

var billId = getQueryVariable("id");（）

最后，把接收到的参数赋值给input框：

    $('.text').val(billId);

这样就能达到上图的效果了，哈哈哈哈，新手上路，不喜勿喷哦！