使用jQuery在页面加载时将字符串添加到url？

Question

我正在尝试在页面加载时将此特定字符串添加到我的网址末尾：

?aa_campaign=f45632

(http://examplesite.com/test.html)

用于营销和跟踪。

我试过这个：

if window.location.href.indexOf("http://examplesite.com/test.html") {
  window.location = "http://examplesite.com/test.html?aa_campaign=f45632";
}

直截了当没有用，但我正在寻找这个想法。有什么想法吗？

Answer 1

不需要jQuery，您可以在大多数“现代”浏览器中使用纯JavaScript，即：

if (window.location.href  === "http://examplesite.com/test.html") {
    window.history.pushState("object or string", "Title", "http://examplesite.com/test.html?aa_campaign=f45632");
}

pushState() 方法

pushState() 接受三个参数：一个状态对象，一个标题（即 当前被忽略）和（可选）一个 URL。让我们检查每一个 这三个参数更详细：

state object — The state object is a JavaScript object which is associated with the new history entry created by pushState(). Whenever

用户导航到新状态，触发 popstate 事件，然后 事件的 state 属性包含历史条目的副本 状态对象。

The state object can be anything that can be serialized. Because Firefox saves state objects to the user's disk so they can be restored

用户重启浏览器后，我们将大小限制为 640k 状态对象的序列化表示上的字符。如果你 传递一个状态对象，其序列化表示大于 this 到 pushState()，该方法将抛出异常。如果你需要 比这更多的空间，我们鼓励您使用 sessionStorage 和/或 本地存储。

title — Firefox currently ignores this parameter, although it may use it in the future. Passing the empty string here should be safe

反对将来对该方法进行更改。或者，您可以通过 您要迁移到的州的简称。

URL — The new history entry's URL is given by this parameter. Note that the browser won't attempt to load this URL after a call to

pushState()，但它可能会尝试稍后加载 URL，例如 用户重新启动浏览器后。新的 URL 不需要 绝对;如果是相对的，则相对于当前 URL 进行解析。 新 URL 必须与当前 URL 同源；除此以外， pushState() 将抛出异常。该参数是可选的；如果它 未指定，它被设置为文档的当前 URL。

SRC：https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history

Answer 2

您可以将字符串添加到window.location.search，以获得更通用的解决方案。

if (location.origin + location.pathname === 'your url here') {
  location.search += 'additional data here';
}

这种方法的优点是您可以将此代码应用于多个页面，而对同一代码的更改较少。

请注意，这将导致页面重新加载，这可能不是最佳的用户体验。既然你说你这样做是为了跟踪，你可以通过将带有新 url 的图像附加到 DOM 来 ping 页面。像这样的：

var pinger = new Image(0,0); // keep the size of the image 0
pinger.src = 'changed url here, with the new query param appended';
document.body.appendChild(pinger); // ping sent
pinger.parentNode.removeChild(pinger); // remove the node when ping is sent

希望有帮助:)

Answer 3

此版本将保留任何现有的查询字符串，并正确附加您的“aa_campaign=f45632”参数字符串。

var w = window.location;
if (w.search.indexOf("aa_campaign") == -1) {
    window.location = w + (w.search.indexOf("?") == -1 ? "?" : "&") + "aa_campaign=f45632";
}

例子：

• http://example.com --> http://example.com?aa_campaign=f45632

• http://example.com/page.html?id=1 --> http://example.com/page.html?id=1&aa_campaign=f45632

Answer 4

试试这个：

if (window.location.href.indexOf("http://examplesite.com/test.html" !== -1) {
  window.location = "http://examplesite.com/test.html?aa_campaign=f45632";
}