当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 讲两件事:1.this指针的用法小探. 2.ie的attachEvent和firefox的addEventListener在事件处理上的区别

Javascript
用jQuery解决IE不支持的option disable属性
jQuery 源代码显示控件 (Ajax加载方式).
JS backgroundImage控制
jQuery 性能优化指南 (1)
jQuery 性能优化指南(2)
jQuery 性能优化指南(3)
input+select(multiple) 实现下拉框输入值
javascript getBoundingClientRect() 来获取页面元素的位置的代码[修正版]
jQuery 图像裁剪插件Jcrop的简单使用
让GoogleCode的SVN下的HTML文件在FireFox下正常显示.
jquery(1.3.2) 斑马线效果代码
JQuery Jcrop 实现图片裁剪的插件
jquery img src 获取实现代码
javascript 历史记录 经常用于产品最近历史浏览
jquery tabs的实现代码
jQuery 剧场版 你必须知道的javascript
JavaScript 闭包深入理解(closure)
js 图片缩放(按比例)控制代码
广告切换效果(缓动切换)
javascript 用局部变量来代替全局变量

Javascript 中的 讲两件事:1.this指针的用法小探. 2.ie的attachEvent和firefox的addEventListener在事件处理上的区别


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 352 ::
收藏到网摘: n/a

第一件事情.
this 指钟是JavaScript语言中的一个特殊指钟,他在代码运行时,指向调用this语句的当前对象.
如果是事件绑定函数,则指向被绑定的元素本身.
<script type="text/javascript">
//by Go_Rush(阿舜) from http://ashun.cnblogs.com/
alert(this===window) //true 直
接调用的时候,指向window本身
var gorush={
f:function(){
alert(this===gorush) //true
}
}
gorush.f() //指向 gorush对象
document.onclick=function(){
alert(this===document) //true ,指向 document
}
/*
element.onclick=function(){
alert(this===element) //true
}
*/
</script>
特别要值得注意的是,当多个对象嵌套的时候, this 是指向最近调用它的那个对象的
obj1={
obj2:{
f:function(){
alert(this===obj1.obj2) //这里 this 并不是指向 obj1的哦。
}
}
}
obj1.obj2.f()
再举一个非常容易出错的例子, 点这里看相关链接
<script type="text/javascript">
//by Go_Rush from http://ashun.cnblogs.com/
//以下gorush1中 this的用法是错误的,这个错误10个程序员6个犯
var gorush1={
showMsg:function(){alert("hello,world")},
doAjax:function(){
new Ajax.Request("index.php",{onSuccess:function(){
this.showMsg()
}})
}
}
//gorush2中的才是对的
var gorush2={
showMsg:function(){alert("hello,world")},
doAjax:function(){
var self=this; //备份 gorush2对象
new Ajax.Request("index.php",{onSuccess:function(){
self.showMsg()
}})
}
}
</script>
第二件事情:
闲话不多说,先上碟小菜.
<script type="text/javascript">
var btn=null
window.onload=function(){
btn=document.getElementById("btn")
if (window.attachEvent) btn.attachEvent("onclick",gorush);
if (window.addEventListener) btn.addEventListener("click",gorush,false)
}
function gorush(){
if (this===window) alert("this==window") //ie6.0下,这句会执行
if (this===btn) alert("this==btn") //ff1.5下, 这句会执行
}
</script>
<input type="button" value="click me" id="btn">
真不明白为什么 ie 会这样搞,让人很郁闷啊,为什么把 this 指向 window呢?
解决方法:
1. 事件绑定的时候不要用 attachEvent, 可怜的我,当时就是用的prototype.js的Event.Observe方法
这样 element.onclick=function..... 这样在两个浏览器中 this 指钟都指向 element
2. 在处理函数 gorush中 用 getEvent()方法统一获取事件,然后在用 evt.srcElement || evt.target 获取 element对象