单击时将Query-String参数添加到静态链接

时间:2014-08-13 15:32:10

标签: javascript html html5 dom

我正在寻找一种在访问者点击静态锚链接时动态注入查询字符串参数的强大方法。

例如链接:

<a href="http://www.johndoeslink.com">Test</a>

我想将查询字符串传递给下一页但必须动态分配值。我怎样才能做到这一点?

我知道这很简单,我只是遗漏了一些明显的东西! = \

提前致谢,

John d

2 个答案:

答案 0 :(得分:9)

有很多方法可以做到这一点。下面我列出了两种非常简单的方法。在这里,我假设您已经引用了a元素(此处我称之为element):

修改href属性

element.href += '?query=value';

使用点击事件监听器

element.addEventListener('click', function(event) {
    // Stop the link from redirecting
    event.preventDefault();

    // Redirect instead with JavaScript
    window.location.href = element.href + '?query=value';
}, false);

答案 1 :(得分:3)

如果您已经知道在加载页面时要追加的值,那么您可以在文档准备就绪时添加它:如果您正在使用JQuery,请使用:

$( 'class' ).attr( 'href', function(index, value) {


return value + '?item=myValue';
});

否则(普通Javascript):

var link = document.getElementById("mylink");
link.setAttribute('href', 'http://www.johndoeslink.com'+'?item=myValue');