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 相关文章推荐
让图片旋转任意角度及JQuery插件使用介绍
Mar 20 Javascript
javascript中call和apply方法浅谈
Sep 27 Javascript
jQuery中height()方法用法实例
Dec 24 Javascript
JavaScript常用标签和方法总结
Sep 01 Javascript
一道面试题引发的对javascript类型转换的思考
Mar 06 Javascript
jQuery实现简单的抽奖游戏
May 05 jQuery
vue中使用localstorage来存储页面信息
Nov 04 Javascript
Vue模板语法中数据绑定的实例代码
May 17 Javascript
vue2之简易的pc端短信验证码的问题及处理方法
Jun 03 Javascript
扫微信小程序码实现网站登陆实现解析
Aug 20 Javascript
解析JS在获取当前月的最后一天遇到的坑
Aug 30 Javascript
vue style width a href动态拼接问题的解决
Aug 07 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
ASP知识讲座四
2006/10/09 PHP
基于Linux调试工具strace与gdb的常用命令总结
2013/06/03 PHP
php解压文件代码实现php在线解压
2014/02/13 PHP
浅析php适配器模式(Adapter)
2014/11/25 PHP
PHP识别二维码的方法(php-zbarcode安装与使用)
2016/07/07 PHP
老生常谈文本文件和二进制文件的区别
2017/02/27 PHP
JavaScript 特殊字符
2007/04/05 Javascript
简单的JS多重继承示例
2008/03/13 Javascript
window.addEventListener来解决让一个js事件执行多个函数
2012/12/26 Javascript
表单元素的submit()方法和onsubmit事件应用概述
2013/02/01 Javascript
jquery.validate的使用说明介绍
2013/11/12 Javascript
AngularJS中directive指令使用之事件绑定与指令交互用法示例
2016/11/22 Javascript
javascript动画之磁性吸附效果篇
2016/12/09 Javascript
bootstrap fileinput 插件使用项目总结(经验)
2017/02/22 Javascript
JS实现含有中文字符串的友好截取功能分析
2017/03/13 Javascript
使用validate.js实现表单数据提交前的验证方法
2018/09/04 Javascript
用Cordova打包Vue项目的方法步骤
2019/02/02 Javascript
在Django的模型中添加自定义方法的示例
2015/07/21 Python
详解Django框架中用户的登录和退出的实现
2015/07/23 Python
python实现RSA加密(解密)算法
2016/02/17 Python
python 文件操作api(文件操作函数)
2016/08/28 Python
python决策树之C4.5算法详解
2017/12/20 Python
python批量设置多个Excel文件页眉页脚的脚本
2018/03/14 Python
Python判断中文字符串是否相等的实例
2018/07/06 Python
Flask框架Jinjia模板常用语法总结
2018/07/19 Python
用python写一个定时提醒程序的实现代码
2019/07/22 Python
新年福利来一波之Python轻松集齐五福(demo)
2020/01/20 Python
python实现微信打飞机游戏
2020/03/24 Python
Python多线程thread及模块使用实例
2020/04/28 Python
面料业务员岗位职责
2013/12/26 职场文书
实习生求职自荐信
2014/02/07 职场文书
打造高效课堂实施方案
2014/03/22 职场文书
汽车广告策划方案
2014/05/31 职场文书
辩护词范文大全
2015/05/21 职场文书
2016年习主席讲话学习心得体会
2016/01/20 职场文书
蔬果开业典礼发言稿应该怎么写?
2019/09/03 职场文书