jquery替代链接onerror?

时间:2015-03-19 21:29:41

标签: javascript jquery html onerror

我的jquery应用程序在html中包含指向服务器上托管的文档的链接,某些用户无法访问该文档。我可以在另一台服务器上托管该文档的副本。

如果用户无法访问原件,我希望将用户定向到副本。但如果可能的话,要访问原文。

我想:

    <a href="http://www.theoriginal.org"     onerror="http://www.thecopy.org">Link</a>

但是被忽略了。我看到很多关于破碎图像的问题和答案,但对其他类型的链接并不多。

如果相关,&#34;原创&#34;链接是由一些JavaScript插入的。

我尝试了建议的Ajax代码,使用谷歌的主页作为我的示例网址,不幸的是遇到了这样的问题:&#34;跨源请求被阻止:同源策略不允许在{{读取远程资源3}}。这可以通过将资源移动到同一域或启用CORS来解决。 &#34; 所以我无法通过这种方式测试页面的存在。

2 个答案:

答案 0 :(得分:0)

您可以发出ajax请求,并根据响应代码更改链接href

<a class="if-not-working" data-replace-with="http://thecopy.org" href="http://www.theoriginal.org">Link</a>

JS:

$('.if-not-working').each(function(){
  $this = $(this);
  $.ajax({
    type: 'GET',
    'url': $this.attr('href'),
    statusCode: {
      400: function() {
        $this.attr('href', $this.data('replace-with'));
      },
      404: function() {
        $this.attr('href', $this.data('replace-with'));
      },
      500: function() {
        $this.attr('href', $this.data('replace-with'));
      }
    }
  });
});

答案 1 :(得分:0)

以下是检查文档是否存在的常规jQuery / ajax代码:

    $.ajax({
    url:'example.html',
    type:'HEAD',
    error: function()
    {
        //file not exists
        $('a').attr('href', 'backup.html');
    },
    success: function()
    {
        //file exists
        $('a').attr('href', ''example.html'');
    }
});

如果您的页面上有很多需要备份链接的链接,您可以通过循环浏览页面中的所有链接并在其中传递备份链接来使其成为一项功能,否则循环遍历整个页面即可矫枉过正。