jQuery外链新窗口打开

知更鸟
1482
文章
6919
评论
2016年8月15日19:47:06来源:前端开发博客 2 3.6K 641字阅读2分8秒

jQuery外链新窗口打开

对于外链,为了留住用户在本站,我们通常会使用新窗口打开,你可以设置target="_blank"。然而手动一个是麻烦,另一个则是有可能会遗漏,本文通过jQuery查询要点击的链接,添加相关属性,使其打开新窗口。

  1. $(document).on('click','a',function(){
  2.     var url = this.href,hash='';
  3.     if(url.indexOf('#')>-1){
  4.         hash = !!url.split('#')[1] ? '#' + url.split('#')[1] :'';
  5.         url = url.split('#')[0];
  6.     }
  7.     if(url && url.substr(0,4) == 'http' && url.indexOf('caibaojian.com')<0 ) {
  8.         this.href = url.indexOf('?') > -1 ? url+'&utm_source=caibaojian.com'+hash:url+'?utm_source=caibaojian.com'+hash;
  9.         this.setAttribute('target', '_blank');
  10.     }
  11. })

以上代码中,你可以将caibaojian.com换为你自己的域名。

原文:http://caibaojian.com/jquery-open-new-window.html

weinxin
关于本站
分享交流WordPress经验与技巧,关注前端设计与网站制作。仅用于功能演示。
最佳 CSS 框架 Web前端

最佳 CSS 框架

在构建网站时,使用 CSS 框架是一个实时的节省,因为它为您提供了每个网页设计师和前端开发人员在制作网站时需要的工具。 CSS 框架是一个软件框架,它允许使用 HTML/CSS 进行更简单、更符合标准...
jQuery幻灯片插件:OWL Carousel Web前端

jQuery幻灯片插件:OWL Carousel

Owl Carousel 是一个强大、实用但小巧的 jQuery 幻灯片插件,它具有以下特点: 兼容所有浏览器 支持响应式 支持 CSS3 过度 支持触摸事件 支持 JSON 及自定义 JSON 格式...
js实时获取浏览器窗口大小 Web前端

js实时获取浏览器窗口大小

js实时获取浏览器窗口大小,我们可以使用addEventListener()方法来实现。该addEventListener()方法可以注册事件处理程序以侦听浏览器窗口resize事件,例如window...
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

评论:2   其中:访客  2   博主  0
    • 葱白的天蓝 葱白的天蓝 @回复 0

      感觉非常不错,自己现在也在学习相关的知识,有需要的可以加qun436476289大家一起学习交流

      • ctoms ctoms @回复 0

        为什么没效果。。 :cry: