去除链接虚线全面分析总结


Posted in Javascript onAugust 15, 2006

传统办法,在标签内加属性 代码多,修改难

<a href="link1.htm" onfocus="this.blur()">link1</a>

<a href="link1.htm" onfocus="this.close()">link1</a>

<a href="link1.htm" hidefocus="true">link1</a>

<a href="link1.htm" hidefocus="hidefocus">link1</a>

<a href="link1.htm" hidefocus>link1</a> 非标准

中级办法,全局控制 

CSS实现 增加IE负担,不推荐使用

a{blr:expression(this.onFocus=this.close());}

a{blr:expression(this.onFocus=this.blur());}

HTC实现 IE支持,并有延迟,不推荐

把下面这段代码存为.htc为扩展名的文件

<public:attach event="onfocus" onevent="hscfsy()"/>
<script language="javascript">
function hscfsy(){
this.blur();
}
< /script>

样式调用

a {behavior:url(htc文件所在路径地址)}

高级办法,全局控制

遍历实现 

window.onload=function()
{
 for(var ii=0; ii<document.links.length; ii++)
 document.links[ii].onfocus=function(){this.blur()}
}

将其封装为一个函数 

function fHideFocus(tName){
aTag=document.getElementsByTagName(tName);
for(i=0;i<aTag.length;i++)aTag[i].hideFocus=true;
//for(i=0;i<aTag.length;i++)aTag[i].onfocus=function(){this.blur();};
}

当前是添加一个hidefocus的属性,注释掉的句子是添加onfucus=this.blur();
然后调用fHideFocus("A");即可把a的虚线框去掉
通过传递不同的参数 可以去掉更多的虚线框 比如"BUTTON"可以去掉button的
但要记住参数要用大写字母

应用技巧及疑问

A. map area内链接如何消除链接虚线?

这是一个观念上的错误,其实应该在所在map的图片上加以控制,而不是在area内,参考传统办法

B. 关于onFocus 

<a href=“http://blog.csdn.net/alonesword/“ onFocus="this.blur()"> 
<Img Src="Example.jpg" Border=0> 
</a>

其中,onFocus是设置鼠标焦点事件的东西,这个可以用,也可以不用,不过为了让更多的浏览器识别的话,建议采用;Border=0 这个才是去除虚线框的关键所在(在网上看到有的人用onFocus=“this.blur()“来消除虚线框,但在本地测试时,仅仅用这一句是不能消除的)

Javascript 相关文章推荐
js URL参数的拼接方法比较
Feb 15 Javascript
JavaScript实现找出字符串中第一个不重复的字符
Sep 03 Javascript
express的中间件basicAuth详解
Dec 04 Javascript
谈谈jQuery Ajax用法详解
Nov 27 Javascript
JS控制页面跳转时未请求要跳转的地址怎么回事
Oct 14 Javascript
js仿京东轮播效果 选项卡套选项卡使用
Jan 12 Javascript
iOS + node.js使用Socket.IO框架进行实时通信示例
Apr 14 Javascript
VueJS事件处理器v-on的使用方法
Sep 27 Javascript
详解如何优雅地在React项目中使用Redux
Dec 28 Javascript
Vue项目自动转换 px 为 rem的实现方法
Oct 29 Javascript
javascript数组常见操作方法实例总结【连接、添加、删除、去重、排序等】
Jun 13 Javascript
uniapp微信小程序实现一个页面多个倒计时
Nov 01 Javascript
静态的动态续篇之来点XML
Aug 15 #Javascript
实用javaScript技术-屏蔽类
Aug 15 #Javascript
巧妙破除网页右键禁用的十大绝招
Aug 12 #Javascript
总结一些js自定义的函数
Aug 05 #Javascript
document对象execCommand的command参数介绍
Aug 01 #Javascript
[JS]点出统计器
Oct 11 #Javascript
破解Session cookie的方法
Jul 28 #Javascript
You might like
PHP中的超全局变量
2006/10/09 PHP
利用PHP脚本在Linux下用md5函数加密字符串的方法
2015/06/29 PHP
PHP判断是手机端还是PC端 PHP判断是否是微信浏览器
2017/03/15 PHP
php在windows环境下获得cpu内存实时使用率(推荐)
2018/02/08 PHP
基于jquery.Jcrop的头像编辑器
2010/03/01 Javascript
MultiSelect左右选择控件的设计与实现介绍
2013/06/08 Javascript
Flexigrid在IE下不显示数据的处理的解决方法
2013/10/24 Javascript
jQuery  ready方法实现原理详解
2016/10/19 Javascript
使用ionic在首页新闻中应用到的跑马灯效果的实现方法
2017/02/13 Javascript
JS优化与惰性载入函数实例分析
2017/04/06 Javascript
实现div内部滚动条滚动到底部和顶部的代码
2017/11/15 Javascript
vue axios数据请求及vue中使用axios的方法
2018/09/10 Javascript
Vue+Express实现登录状态权限验证的示例代码
2019/05/05 Javascript
vue中组件通信的八种方式(值得收藏!)
2019/08/09 Javascript
js实现打字小游戏
2019/12/17 Javascript
javascript实现京东登录显示隐藏密码
2020/08/02 Javascript
使用Python下载Bing图片(代码)
2013/11/07 Python
Python数据类型学习笔记
2016/01/13 Python
Python for循环生成列表的实例
2018/06/15 Python
Python并行分布式框架Celery详解
2018/10/15 Python
python+pyqt5编写md5生成器
2019/03/18 Python
pytorch 在sequential中使用view来reshape的例子
2019/08/20 Python
Python基于read(size)方法读取超大文件
2020/03/12 Python
python爬虫---requests库的用法详解
2020/09/28 Python
使用jquery实现HTML5响应式导航菜单教程
2014/04/02 HTML / CSS
大学军训感言600字
2014/02/25 职场文书
个人合伙协议书范本
2014/10/14 职场文书
护理见习报告范文
2014/11/03 职场文书
采购员岗位职责
2015/02/03 职场文书
2015年大学生党员承诺书
2015/04/27 职场文书
2016年春季运动会通讯稿
2015/11/25 职场文书
2019年怎样写好导游词?
2019/07/02 职场文书
2019年世界儿童日宣传标语
2019/11/22 职场文书
CSS完成视差滚动效果
2021/04/27 HTML / CSS
vscode中使用npm安装babel的方法
2021/08/02 Javascript
springboot+rabbitmq实现智能家居实例详解
2022/07/23 Java/Android