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

Javascript
JS 参数传递的实际应用代码分析
prototype与jquery下Ajax实现的差别
用JS写的简单的计算器实现代码
javascript 数组操作实用技巧
JavaScript 中级笔记 第二章
JavaScript 中级笔记 第三章
JavaScript 中级笔记 第四章 闭包
JavaScript 中级笔记 第五章 面向对象的基础
Mootools 1.2教程 函数
Mootools 1.2教程 事件处理
通过Mootools 1.2来操纵HTML DOM元素
Mootools 1.2教程 设置和获取样式表属性
Mootools 1.2教程 输入过滤第一部分(数字)
Mootools 1.2教程 输入过滤第二部分(字符串)
Mootools 1.2教程 Fx.Tween的使用
Mootools 1.2教程 Fx.Morph、Fx选项和Fx事件
MooTools 1.2中的Drag.Move来实现拖放
Mootools 1.2教程 正则表达式
Mootools 1.2教程 定时器和哈希简介
Mootools 1.2教程 滚动条(Slider)

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


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 278 ::
收藏到网摘: 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对象