使用Javascript：如果没有标签或窗口的历史记录，如何创建一个将用户链接到链接的“返回”链接？ [英] Using Javascript: How to create a 'Go Back' link that takes the user to a link if there's no history for the tab or window?

问题描述

编辑2：没有任何答案似乎有效。甚至没有我之前标记为这个问题的答案。任何帮助表示赞赏。感谢。

首先，我搜索了一个创建'返回'链接的方法，允许用户返回到上一页，这是两种做法：

 < a href =javascript：history.go（-1）> ; [返回]< / a> 
  

和...

 < a href =＃onclick =history.go（-1）; return false;> [返回]< / a> 
  

这两个选项哪一个更好？为什么？ （另外，请注意浏览器兼容性。）

这是问题的一半。现在，如果我的用户访问的是第一页，那么'返回'链接将不起作用，对吧？ （因为窗口或标签没有预先存在的历史记录。）在这种情况下，我希望链接回退并让用户访问 http：//示例。 com。。

即如果历史记录存在，用户将转到上一页，如果没有记录，则转到 http://example.com 。 p>

我该怎么做？希望有人可以提供帮助。

编辑：请注意我不懂JavaScript，所以请让您的答案解释。谢谢。

解决方案

您无法检查 window.history.length 包含您在给定会话中总共访问的页面数量：

window.history.length code>（整数）



只读。返回会话历史记录中的元素数量，包括当前加载的页面。例如，对于在新选项卡中加载的页面，此属性返回1. 引用1




假设用户访问您的页面，点击某些链接并返回：

 
 www.mysite.com/index.html<  - 第一页和现在当前页面< ---- + 
 www .mysite.com / about.html | 
 www.mysite.com/about.html#privacy | 
 www.mysite.com/terms.html<  - 用户使用后退按钮或您提供的解决方案返回
 

现在 window.history.length 是4.由于安全原因，您无法遍历历史记录项目。否则，可能会读取用户的历史记录，并获得他的在线银行会话ID或其他敏感信息。

您可以设置超时时间，以便您可以采取措施页面在给定时间内未加载。但是，如果用户的互联网连接速度较慢并且超时时间很短，则此方法将始终将其重定向到您的默认位置：

  window.goBack = function（e）{
 var defaultLocation =http://www.mysite.com; 
 var oldHash = window.location.hash; 
 
 history.back（）; //尝试返回
 
 var newHash = window.location.hash; 
 
 / *如果上一页在给定时间内尚未加载（本例中为
 * 1000ms），则用户将被重定向到上面给出的默认位置。 
 *这使您可以将用户重定向到其他页面。 
 * 
 *但是，您应该检查是否有当前
 *网站的推荐人。这是历史记录
 *会话中以前记录的良好指标。 
 * 
 *您还应该检查旧位置是否仅在散列中有所不同，例如
 * /index.html#top  - > /index.html#不应该重定向到默认的
 *位置。 
 * / 
 
 if（
 newHash === oldHash&& 
（typeof（document.referrer）！==string|| document） referrer ===）
）{
 window.setTimeout（function（）{
 //重定向到默认位置
 window.location.href = defaultLocation; 
}，1000）; //设置超时时间，单位为ms 
 
 if（e）{
 if（e.preventDefault）
 e.preventDefault（）; 
 if（e.preventPropagation）
 e.preventPropagation（）; 
} 
返回false; //停止事件传播和浏览器默认事件
} 
  

 < span class =gobackonclick =goBack（）;>回去！< / span> 
  

请注意 typeof（document.referrer）！==string非常重要，因为浏览器供应商可能因安全原因（会话哈希，自定义GET URL）而禁用引用链接。但是如果我们检测到一个引用者并且它是空的，那么可以说没有以前的页面（请参阅下面的注释）。仍然可能会出现一些奇怪的浏览器怪癖，所以使用超时比使用简单的重定向更安全。

编辑： Don不要使用< a href ='＃'> ...< / a> ，因为这会为会话记录添加另一个条目。最好使用< span> 或其他元素。请注意， typeof document.referrer 总是string，如果您的页面位于（i）框架。

另见：

• W3C：HTML5：5.4.2历史界面

EDIT-2: None of the answers seem to work. Not even the one I previously marked as the answer of this question. Any help is appreciated. Thanks.

First, I have googled for a how-to on creating a 'Go Back' link that allows the user to return to the previous page, and these are two ways of doing it:

<a href="javascript:history.go(-1)">[Go Back]</a>

and...

<a href="#" onclick="history.go(-1);return false;">[Go Back]</a>

Which of these two is a better choice? And why? (Also, please shed some light on browser compatibility.)

That's one half of the question. Now if mine is the first page the user is visiting, the 'Go Back' link wouldn't work, right? (As there's no pre-existing history for the window or tab.) In that case, I want the link to fallback and take the user to http://example.com.

i.e. if history exists, the user is taken to the previous page, and if it doesn't he's taken to http://example.com.

How do I do that? Hope someone can help.

EDIT: Please note that I do not know JavaScript, so kindly make your answer explanative. Thanks.

解决方案

You cannot check window.history.length as it contains the amount of pages in you visited in total in a given session:

window.history.length (Integer)

Read-only. Returns the number of elements in the session history, including the currently loaded page. For example, for a page loaded in a new tab this property returns 1. ^{Cite 1}

Lets say a user visits your page, clicks on some links and goes back:

www.mysite.com/index.html <-- first page and now current page                  <----+
www.mysite.com/about.html                                                           |
www.mysite.com/about.html#privacy                                                   | 
www.mysite.com/terms.html <-- user uses backbutton or your provided solution to go back

Now window.history.length is 4. You cannot traverse through the history items due to security reasons. Otherwise on could could read the user's history and get his online banking session id or other sensitive information.

You can set a timeout, that will enable you to act if the previous page isn't loaded in a given time. However, if the user has a slow Internet connection and the timeout is to short, this method will redirect him to your default location all the time:

window.goBack = function (e){
    var defaultLocation = "http://www.mysite.com";
    var oldHash = window.location.hash;

    history.back(); // Try to go back

    var newHash = window.location.hash;

    /* If the previous page hasn't been loaded in a given time (in this case
    * 1000ms) the user is redirected to the default location given above.
    * This enables you to redirect the user to another page.
    *
    * However, you should check whether there was a referrer to the current
    * site. This is a good indicator for a previous entry in the history
    * session.
    *
    * Also you should check whether the old location differs only in the hash,
    * e.g. /index.html#top --> /index.html# shouldn't redirect to the default
    * location.
    */

    if(
        newHash === oldHash &&
        (typeof(document.referrer) !== "string" || document.referrer  === "")
    ){
        window.setTimeout(function(){
            // redirect to default location
            window.location.href = defaultLocation;
        },1000); // set timeout in ms
    }
    if(e){
        if(e.preventDefault)
            e.preventDefault();
        if(e.preventPropagation)
            e.preventPropagation();
    }
    return false; // stop event propagation and browser default event
}

<span class="goback" onclick="goBack();">Go back!</span>

Note that typeof(document.referrer) !== "string" is important, as browser vendors can disable the referrer due to security reasons (session hashes, custom GET URLs). But if we detect a referrer and it's empty, it's probaly save to say that there's no previous page (see note below). Still there could be some strange browser quirk going on, so it's safer to use the timeout than to use a simple redirection.

EDIT: Don't use <a href='#'>...</a>, as this will add another entry to the session history. It's better to use a <span> or some other element. Note that typeof document.referrer is always "string" and not empty if your page is inside of a (i)frame.

See also:

• W3C: HTML5: 5.4.2 The History interface

这篇关于使用Javascript：如果没有标签或窗口的历史记录，如何创建一个将用户链接到链接的“返回”链接？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！