【问题标题】:RegEx expression or jQuery selector to NOT match "external" links in hrefRegEx 表达式或 jQuery 选择器与 href 中的“外部”链接不匹配
【发布时间】:2014-07-27 21:20:06
【问题描述】:

我有一个覆盖链接行为的 jQuery 插件,以允许 Ajax 加载页面内容。使用像 $(document).on('click','a', function(){}); 这样的委托事件就足够简单了。

我只希望它适用于与这些不同的链接(Ajax 加载不适用于它们,因此此类链接需要正常运行):

target="_blank"      // New browser window
target="_self"       // Force replacement of current window (specific to my plugins)
href="#..."          // Bookmark link (page is already loaded). 
href="afs://..."     // AFS file access. 
href="cid://..."     // Content identifiers for MIME body part.
href="file://..."    // Specifies the address of a file from the locally accessible drive.
href="ftp://..."     // Uses Internet File Transfer Protocol (FTP) to retrieve a file.
href="http://..."    // The most commonly used access method. 
href="https://..."   // Provide some level of security of transmission 
href="mailto://..."  // Opens an email program.
href="mid://..."     // The message identifier for email.
href="news://..."    // Usenet newsgroup.
href="x-exec://..."  // Executable program.
href="http://AnythingNotHere.com"  // External links

示例代码:

$(document).on('click', 'a:not([target="_blank"])', function(){
    var $this = $(this);
    if ('some additional check of href'){
        // Do ajax load and stop default behaviour
        return false;
    }
    // allow link to work normally
});

问:

有没有一种方法可以轻松检测所有只能在当前网站内导航的“本地链接”?不包括上述所有变体。

注意:这是针对 MVC 5 Razor 网站,因此不太可能出现绝对网站 URL。

【问题讨论】:

  • 为什么要投反对票?我认为这个结构良好的问题没有任何问题。
  • Down-voter(s) (复数现在)... 有用的 cmets 好吗?这是一个完全有效的问题。
  • 我可能会使用选择器a:not([href*="://"]),然后将其与其他选择器结合使用。单个选择器可能是不可能的。
  • @Quentin:我已经看到了这个问题,这不是重复的(不完全相同的问题)。请阅读具体细节。
  • 在什么方面不重复?能够将链接识别为外部链接以添加类与能够识别它们以将它们从您的选择中排除是相同的。

标签: javascript jquery html regex


【解决方案1】:

我可能会使用选择器:

$('a:not([href*="://"],[target="_blank"],[href^="#"],[href^="mailto:"])')

http://jsfiddle.net/mblase75/Pavg2/

请注意,mailto: 是正确的,而不是您原来问题中的 mailto://


为了彻底起见,以下内容还将捕获使用绝对 URL (http://the-domain-you-are-on-now.com/whatever.html) 的内部链接:

$('a:not([href*="://"],[target="_blank"],[href^="#"],[href^="mailto:"]),a[href^="'+location.protocol+'//'+location.hostname+'"]')

http://jsfiddle.net/mblase75/Pavg2/4/

【讨论】:

  • 建议您也将其发布到stackoverflow.com/questions/2910946/…
  • 你承认这是一个重复的问题吗?
  • 不,只是答案也涵盖了那个。您会注意到他们的问题中没有mailto 或其他自定义链接:)
  • +1 并接受:工作很愉快。并且看起来与 所谓的重复 上的其他答案完全不同:>
  • +1 用于漂亮的 jsFiddle,但也应该使用绝对路径处理内部链接的情况,否则我错了吗?!
【解决方案2】:

我不知道你为什么拒绝我的最后一个答案,但在参考网址上你会找到确切的条件

var a = new RegExp('/' + window.location.host + '/');
     if(!a.test(this.href)){
     //do stuff when it an external link
     }
    else{
    // do stuff when it's internal link
    }

这里是参考http://css-tricks.com/snippets/jquery/open-external-links-in-new-window/

【讨论】:

  • 您的原始答案是仅链接的答案。如果您将链接中的重要内容直接包含在您的问题中会很好(因为您现在已经关闭,但是您仍然应该提供参考链接)
  • 其实我是stackoverflow的新手
  • @TrueBlueAussie 请注意,他使用的是 href 属性,而不是 href 属性。它们是有区别的。这种区别使这个答案正确,而可疑重复中的答案不正确。
  • 它只是检查网址是外部链接还是同一网站的链接,所以我想它会起作用
  • 我已经在 chrome 中确认了,但我没有跨浏览器检查。如果有一些旧版本的 IE 不能以相同的方式工作,我不会感到惊讶jsfiddle.net/W5u8e
猜你喜欢
  • 2021-05-11
  • 1970-01-01
  • 1970-01-01
  • 2019-08-23
  • 1970-01-01
  • 2011-05-13
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多