如何在 href 上传递变量？

Question

我试图在 href=""

时给出另一个变量

<a href="a.html" id="a">Hello</a>

以上是我的代码。

我想在转到 a.html 时传递名为 fruit 的值 apple 变量。我如何在 JavaScript 或 jQuery 中执行此操作？

Answer 1

您可以通过将现有值与新值连接来重置 href 值：

var el = document.getElementById('a');
el.href += '?fruit=apple';
console.log(el.href);

<a href="a.html" id="a">Hello</a>

Answer 2

只需在您的主页上执行此操作：

<a href="a.html?fruit=apple" id="a">Hello</a>

并在 a.html 上添加此代码：

function getParameterByName(name, url) {
        if (!url) url = window.location.href;
        name = name.replace(/[\[\]]/g, '\$&');
        var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
            results = regex.exec(url);
        if (!results) return null;
        if (!results[2]) return '';
        return decodeURIComponent(results[2].replace(/\+/g, ' '));
    }

    var fruit = getParameterByName('fruit');

<a href="a.html?fruit=apple" id="a">Hello</a>

Answer 3

JS 可以（轻松）在 URL 之间进行通信的唯一方法是在 link 上创建一个参数。例如：

<a href="a.html?fruit=apple" id="a">Hello</a>

在接收页面上，获取该参数数据。如果您希望纯粹通过 JS 将数据嵌入到 link 中，您可以使用 jQuery 库使用类似于此的内容附加到 HREF：

$("a").attr("href", '?fruit=' + 'apple');

Answer 4

据我了解，您希望在打开新页面时将查询参数 fruit=apple 添加到锚标记 url。所以你需要使用window.open()打开新页面

document.getElementById("a").onclick = function(e){
  e.preventDefault();
  window.open(this.href+"?fruit=apple", '_blank');
}

<a href="a.html" id="a">Hello</a>

因为新标签在代码段中不起作用，请在 jsfiddle 中查看。

Answer 5

需要一种方法来访问 Html 参数。我不相信它在 html 中是可能的。但是，有很多 Javascript 方法。

例如：

function getUrlVars() { 
var vars = {}; 
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) { 
   vars[key] = value; 
});
return vars;

}

你可以像这样调用这个函数

var fruit = getUrlVars()["fruit"];
console.log(fruit);
//Apple

您在 href 中的 URL 看起来像：

a.html?fruit=苹果

然而，这是硬编码的，如果你想用这个 prehpas 获得一些不错的动态，请使用 angularJS 来创建它。

Source

如何在 href 上传递变量？

How to pass variable on href?

html

javascript

jquery

href