JavaScript 学习笔记 Black.Caffeine 09.11.28


Posted in Javascript onNovember 30, 2009

1. 之前写的一直都是分散的函数,用到什么功能,就写什么函数,觉得不够整洁,所以这次写的是封装的类,用起来还不错,但是传递参数的时候遇到了不少问题,所以,查阅了很多资料,总结如下:
1)动态绑定事件问题:
需要将onclick事件绑定到对象上,比如列表项。需要用到addEventListener或者attachEvent,用于吧函数操作添加到事件中去,而不是覆盖,但是,attachEvent不支持FF,FF只能用addEventListener。so,就需要一个函数,把它们俩给综合起来,于是乎,这个函数诞生了:

function addEventHandler(oTarget, sEventType, fnHandler) 
{ 
    if(oTarget.addEventListener) 
    {oTarget.addEventListener(sEventType, fnHandler, false);} 
    else if(oTarget.attachEvent) 
    {oTarget.attachEvent('on' + sEventType, fnHandler);} 
    else{oTarget['on' + sEventType] = fnHandler;} 
}

2)传递this参数问题:
由于我吧函数和属性都封装到了一个类里面,所以在绑定onclick之类的事件是,就会产生一个问题,比如,addEventHandler(this.elems[i],"click",this.Move);,这样就出错了,因为在onclick事件发生的时候,调用的this就不是指向这个封装的类了,于是乎,就需要用到apply()了~——应用某一对象的一个方法,用另一个对象替换当前对象。具体格式我就不用说了,网上一大堆~函数:
var Bind = function(object,func){ 
        var args = Array.prototype.slice.call(arguments).slice(2); 
        return function(){ 
            return func.apply(object,args); 
        } 
    }

调用:
this._fnMove=Bind(this,this.move,i);//this.move是我定义的一个成员函数,封装在类中
//this.elems[i].onclick=this._fnMove;//吧上面那句话换成这句话也是可以的,只不过,onclick事件就被替换为this._fnMove,而不是添加this._fnMove进去
addEventHandler(this.elems[i],"click",this._fnMove);
这样就OK了~
PS.call()也是基本相同的功能,但具体参数不一样
2.setInterval问题
1)与setTimeout的区别
在一般情况下,setTimeout仅执行一次,(当然,如果在一个函数里反复调用setTimeout,就可以重复执行了)而 setInterval是可以重复执行的,直到clearIntercal()
2)在IE下不兼容问题
这个问题折磨了我50%的时间,哦买噶,以后是不是要半生都浪费在跟IE干仗上了。。。
本来,在chrome,ff,safari上都运行的很好,我相当激动,以至于遗忘了IE。。。后来在IE上一试,结果,完了,修改,google(此处为动词,嘿嘿),基本上花了大半天时间吧,终于搞定。 之前,语句是这样的:this.timer=setInterval(this.unfold,5,this.divs[index],this);结果在IE下完全不好使。最后,在某位大侠的文章里面看到如下描述:在IE下,setTimeout和setInterval是不支持参数传递的.问题很快就解决掉了,果然是我太菜了~
解决问题的函数如下:
var mySetInterval = setInterval; 
window.setInterval = function(callback, interval) 
{ 
var args = Array.prototype.slice.call(arguments, 2); 
function callFn(){callback.apply(null, args);} 
return mySetInterval(callFn, interval); 
} var mySetTimeOut = setTimeout; //修改setInterval 
window.setTimeout = function(callback, timeout) 
{ 
var args = Array.prototype.slice.call(arguments, 2); 
function callFn(){callback.apply(null, args);}

然后使用window.setTimeout或window.setInterval调用就可以了~
我的语句修改如下:
this.timer=window.setInterval(this.unfold,5,this.divs[index],this); //其中,this.divs[index],this是传递的两个参数
再次谢谢那位大侠,虽然他不认识我~
目前,在IE中还有点排版的小问题,继续学习~全力兔子!
Javascript 相关文章推荐
兼容Mozilla必须知道的知识。
Jan 09 Javascript
背景音乐每次刷新都可以自动更换
Feb 01 Javascript
写出更好的JavaScript之undefined篇(上)
Nov 22 Javascript
JavaScript也谈内存优化
Jun 06 Javascript
JavaScript控制网页平滑滚动到指定元素位置的方法
Apr 17 Javascript
javascript元素动态创建实现方法
May 13 Javascript
JavaScript中style.left与offsetLeft的使用及区别详解
Jun 08 Javascript
JS创建Tag标签的方法详解
Jun 09 Javascript
vue项目部署到Apache服务器中遇到的问题解决
Aug 24 Javascript
在axios中使用params传参的时候传入数组的方法
Sep 25 Javascript
深入浅析js原型链和vue构造函数
Oct 25 Javascript
js实现简单的打印表格
Jan 15 Javascript
Ruffy javascript 学习笔记
Nov 30 #Javascript
jquery 分页控件实现代码
Nov 30 #Javascript
JS 动态获取节点代码innerHTML分析 [IE,FF]
Nov 30 #Javascript
Aptana调试javascript图解教程
Nov 30 #Javascript
jQuery chili图片远处放大插件
Nov 30 #Javascript
document.body.scrollTop 值总为0的解决方法 比较常见的标准问题
Nov 30 #Javascript
javascript 设置某DIV区域内的checkbox复选框
Nov 30 #Javascript
You might like
应用开发中涉及到的css和php笔记分享
2011/08/02 PHP
探讨Hessian在PHP中的使用分析
2013/06/13 PHP
PHP中类的自动加载的方法
2017/03/17 PHP
visual studio code 调试php方法(图文详解)
2017/09/15 PHP
Thinkphp5 微信公众号token验证不成功的原因及解决方法
2017/11/12 PHP
javascript 获取iframe里页面中元素值的方法
2014/02/17 Javascript
JavaScript中合并数组的N种方法
2014/09/16 Javascript
js文本框走动跑马灯效果代码分享
2015/08/25 Javascript
基于jquery实现一个滚动的分步注册向导-附源码
2015/08/26 Javascript
JS+CSS实现简易实用的滑动门菜单效果
2015/09/18 Javascript
Bootstrap和Angularjs配合自制弹框的实例代码
2016/08/24 Javascript
Bootstrap3 Grid system原理及应用详解
2016/09/30 Javascript
常用JS图片滚动(无缝、平滑、上下左右滚动)代码大全(推荐)
2016/12/20 Javascript
Node.js查找当前目录下文件夹实例代码
2017/03/07 Javascript
js下载文件并修改文件名
2017/05/08 Javascript
纯JS实现简单的日历
2017/06/26 Javascript
浅析Vue项目中使用keep-Alive步骤
2018/07/27 Javascript
微信js-sdk 录音功能的示例代码
2019/11/01 Javascript
[01:03:54]Liquid vs IG 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
[36:09]Secret vs VG 2019国际邀请赛淘汰赛 败者组 BO3 第一场 8.24
2019/09/10 DOTA
python thread 并发且顺序运行示例
2009/04/09 Python
Python聊天室程序(基础版)
2018/04/01 Python
快速解决pandas.read_csv()乱码的问题
2018/06/15 Python
Python对数据进行插值和下采样的方法
2018/07/03 Python
python替换字符串中的子串图文步骤
2019/06/19 Python
pytorch-神经网络拟合曲线实例
2020/01/15 Python
纯CSS实现颜色渐变效果(包含环形渐变、线性渐变、彩虹效果等)
2014/05/07 HTML / CSS
Java的五个基础面试题
2016/02/26 面试题
学子宴答谢词
2014/01/25 职场文书
大学生在校学习的自我评价
2014/02/18 职场文书
工程售后服务方案
2014/06/08 职场文书
讲文明知礼仪演讲稿
2014/09/13 职场文书
人力资源部岗位职责
2015/02/11 职场文书
辛德勒的名单观后感
2015/06/03 职场文书
远程教育培训心得体会
2016/01/09 职场文书
python 提取html文本的方法
2021/05/20 Python