【问题标题】:Can I know when people open a link on my site in new tab?我可以知道人们何时在新标签中打开我网站上的链接吗?
【发布时间】:2011-12-20 07:23:24
【问题描述】:

我想知道的是,当人们点击我网站上的链接(内部链接 - 不是到其他网站)时,如果他们只是点击了它,或者如果 ctrl-点击它(或右键点击 - 在新标签中打开)。

我使用 PHP。

例如: 人在 page1 上,然后单击 page2 的链接。 当他们在第 2 页时,我想知道他们来自哪里(_server['http_referer'] 给了我),但我也想知道他们是否在新窗口/标签中打开了页面。由于页面上的历史返回按钮,我需要知道这一点。

这样做的原因是要了解网站周围的浏览历史记录 - 我创建会话来跟踪浏览历史记录(这样我就可以在任何给定时间返回一页、两页或三页)但我不知道'不希望会话在选项卡之间发生冲突,以便每个选项卡都有自己的浏览历史记录。这就是为什么我需要为每个打开的标签创建新会话。


我发现可能解决我的问题的方法是使用类似于此的 javascript:

<script>
var history_status = history.length;
var referrer_site = document.referrer;

if(history_status > 1 && referrer_site != "") {
    alert(referrer_site);
} else {
    alert('No referrer site');
}
</script>

我需要对其进行更多更改,但这是我的第一个演示,以检查它是否有效(确实有效)

我首先需要找到用户正在使用的浏览器,因为当您使用 IE 时,history_status 为历史中的第一页给出 0,而如果您使用的是 Firefox 或 Chrome,则为 1。

【问题讨论】:

  • 您可以使用 javascript onreadyhistory 对象来检查是否有任何历史记录。如果是这样,用户只需单击该链接,您就可以显示/隐藏您使用 PHP 创建的历史元素。
  • 浏览器已经内置了“返回 X 页”功能(通常通过按住返回按钮触发)。你为什么要重新发明轮子?
  • @Quentin 你不明白我在做什么。用户不应该决定他返回多少页。

标签: php session tabs browser-history


【解决方案1】:

这听起来不像是好的用户体验。后退按钮和允许人们打开新标签是用户期望以某种方式表现的东西。我个人会觉得很沮丧。如果他们不能仅针对该标签形成自己独特的浏览历史记录,那么新标签的意义何在?

如果你真的想这样做。创建一个带有数字的 cookie,在每个页面加载时增加一个数字并将页面 URL 存储在您的数据库中以用于该会话。在页面加载时,拉入历史记录并通过 JavaScript 将其加载到浏览器历史记录中。哎呀。

【讨论】:

  • 感谢您的回答,但我想我没有用足够的细节描述我的问题。我还找到了一些方法可以使用 javascript 将其入侵到我的系统中。这样做的原因是因为我有您填写的表格,在该表格之后是另一个表格,但是当您保存时,我想带您返回两个站点,这就是我在会话中保存引荐站点的原因。
【解决方案2】:

由于这个问题真的很老,我将说明这个问题以使其更清楚。希望我也没有误解所提出的问题。

案例:
- 我有一个网站。这个网站有一个表格。该表格位于 2 个(或更多)网页上:Form p001Form p002(... Form pX)。
- 在带有 Form p001 的页面上,有一个按钮,其中包含指向 Form p002 所在页面的链接。
- 在表单最后一部分的页面上,在我的例子中是 Form p002,有提交按钮。当您单击将您发送到页面 Form p001 页面或您之前在我网站上的任何页面的按钮时,提交按钮会将您重定向到 我的网站上 的任何页面您加载了页面Form p001
- 想象以下 3 个 example 案例(显然有超过 3 个可能的案例,只是为了简短起见)。

  • 示例 01:我在我网站的 Page X 上。有表单的按钮,我单击它并转到表单页面第 1 部分 (Form p001)。我单击按钮 Part-02 以转到带有表单 (Form p002) 的第 2 部分的页面。当我完成表单的第二部分时,我点击提交。这会将我重定向到我网站上的 Page X
  • 示例 02:在浏览了我网站上的几个页面后,我现在位于 Page Y。有表单的按钮,我右键单击它并在新选项卡(选项卡 02)中打开表单页面第 1 部分 (Form p001)。我单击按钮 Part-02 以转到带有表单 (Form p002) 的第 2 部分的页面。当我完成表单的第二部分时,我点击提交。这会将我重定向回我网站上的 Page Y(标签 02 内)。
  • 示例 03:在浏览了我网站上的几个页面后,我现在位于 Page Z。有表单的按钮,我右键单击它并在新选项卡(选项卡 02)中打开表单页面第 1 部分 (Form p001)。我右键单击按钮 Part-02 以转到新选项卡(选项卡 03)内包含表单 (Form p002) 的第 2 部分的页面。当我完成表单的第二部分时,我点击提交。这会将我重定向回我网站上的 Page Z(标签 03 内)。

如果此人已加载表单的第一页(表单 p001),通过将表单页面的链接直接放在新选项卡或窗口内的浏览器的 LOCATION/ADDRESS 栏中,那么我们假设您将被重定向到主页。这与这个问题并不真正相关。

回答: 您可以使用 window.localStoragedocument.referrer
您可以使用 window.localStorage 存储原始页面,即我在进入表单第一页之前所在的网站上的页面。测试以下代码。

somePageOnMyWebsite.html(页面 X、Y 或 Z)

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
    <h1>A Random page on My Website</h1>
    <p>My paragraph.</p>
    <a type="button" href="formp001.html" target="_blank">Click to form</a>
</body>
</html>


formp001.html

<!DOCTYPE html>
<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script>
        $(document).ready(function(){
            var originalPage = document.referrer;
            if( originalPage != null)
                window.localStorage.setItem("redirectPage", originalPage);
            else
                window.localStorage.setItem("redirectPage", "");
        });
    </script>
</head>
<body>
    <h1>Form p001</h1>
    <form action="formp002.html" target="_self" method="post">
        <input type="submit" value="Go to Form p002" />
    </form>
</body>
</html>


formp002.html

<!DOCTYPE html>
<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script>
        $(document).ready(function(){
            if (window.localStorage.getItem("redirectPage") === null || window.localStorage.getItem("redirectPage") === ""){
                // The form was not accessed by clicking on a link on a page on my website, so just redirect to my homepage ...
                document.getElementsByTagName("FORM")[0].setAttribute("action", "./hometest.html");
            } else{
                document.getElementsByTagName("FORM")[0].setAttribute("action", window.localStorage.redirectPage);
            }
        });
    </script>
</head>
<body>
    <h1>Form p002</h1>
    <form action="#" target="_self" method="post">
        <input type="submit" value="Submit" />
    </form>
</body>
</html>


hometest.html(我网站的主页)

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
    <h1>HOME PAGE</h1>
    <p>My home</p>
</body>
</html>



我的回答基于 birgir 对 Luc 的回答的评论。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2017-05-11
    • 2016-08-02
    • 2019-11-16
    • 2017-02-22
    • 2014-03-02
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多