外部链接的临时页面重定向

时间:2015-12-05 08:26:16

标签: javascript jquery html .htaccess redirect

我不确定究竟是什么称呼所以我会尽力解释它。

使用者>连接到我的网站>点击浏览导航菜单等等。 >查找外部网站的链接并单击它。

我希望他们成为一个5-10秒的小缓冲区,暂时将其重定向到mywebsite.com/goodbye.html

我不确定如何让我的网站抓住他点击的网址,并在5-10秒重定向缓冲区结束后仍将其重定向到原始链接。我也不确定如何在我的整个网站上使用它。

/////////////////////////////////////////////// ///////////////////////////////// 所有这些来自mywebsite.com的基于文本的传出网址。

用户点击bob.com> 5秒重定向到mywebsite.com/goodbye.html> bob.com

用户点击david.com> 5秒重定向到mywebsite.com/goodbye.html> david.com

用户点击google.com> 5秒重定向到mywebsite.com/goodbye.html> google.com

用户点击stackoverflow.com> 5秒重定向到mywebsite.com/goodbye.html> stackoverflow.com

2 个答案:

答案 0 :(得分:0)

您的问题非常广泛,但这是一个非常简单的设置。

脚本尝试捕获每个'a'元素的点击次数。它会检查其href属性。如果以http开头,则会触发特殊行为,否则只会执行正常行为。

特殊行为包括显示一些内容并在5秒后导航。

这种结构的优点是它的工作非常透明。如果您没有启用Javascript(想想网络抓取工具),点击将正常工作,没有额外的内容和中间的延迟。

// Capture all link clicks.
$('a').on('click', function(event) {
  
  // Get the element and its href attribute.
  var $element = $(event.target);
  var link = $element.attr('href');
  
  if (link.substr(0, 4) == 'http') {
    // If the link starts with http, assume external link.
    // In that case, block normal behaviour, insert custom content and navigate after 5 seconds.
    event.preventDefault();

    $element.html("Leaving this website in 5...");

    setTimeout(function() {
      console.log("This is when the redirect would take place, if not in Staack Snippets");
      document.location.href = link;
    }, 5000);
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<a href="/404.html">Go to internal link</a>
<br><br>
<a href="http://www.google.com">Go to google</a>

现在,示例并不完整。我只是更改了链接的文本,而在您的情况下,您可能希望使用AJAX加载一些再见页面并将其显示在叠加层中。

另请注意,该示例并不完全可用作堆栈代码段,因为它显然会尝试通过Ajax加载新页面(Google),但失败了。除此之外,逻辑代码工作正常。

替代

作为替代方案,您实际上可以重定向到再见页面,并使用它发布目标网址。几秒钟后,该页面可以重定向到目标页面。可以通过在再见页面中插入<meta refresh>标签来完成重定向。该页面必须是一个动态页面:

<meta http-equiv="refresh" content="5; url=http://google.com/">

答案 1 :(得分:0)

将所有外部链接更改为mywebsite.com/goodbye.html,并在查询字符串中添加目标页面。像这样的东西mywebsite.com/goodbye.html?redirect=david.com然后在你的再见页面添加以下的Javascript

setTimeout(function(){  
  var redirectTo = getParameterByName('redirect')
  window.location.href = redirectTo
  //OR window.location.replace(redirectTo)
}, 5000);

// From https://stackoverflow.com/a/901144/3218330 
function getParameterByName(name) {
  name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
  var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
  results = regex.exec(location.search);
  return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}

getParameterByName()来自https://stackoverflow.com/a/901144/3218330