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异步请求实例代码
Jun 21 Javascript
用jQuery获取IE9下拉框默认值问题探讨
Jul 22 Javascript
IE下JS读取xml文件示例代码
Aug 05 Javascript
Jqgrid设置全选(选择)及获取选择行的值示例代码
Dec 28 Javascript
js数字转换为float,取N位小数
Feb 08 Javascript
js检测浏览器版本、核心、是否移动端示例
Apr 24 Javascript
jQuery实现的多选框多级联动插件
May 02 Javascript
JS的location.href跳出框架打开新页面的方法
Sep 04 Javascript
JS实现拖拽的方法分析
Dec 20 Javascript
Angular.JS利用ng-disabled属性和ng-model实现禁用button效果
Apr 05 Javascript
微信小程序 slot踩坑的解决
Apr 01 Javascript
element-ui 文件上传修改文件名的方法示例
Nov 05 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
帅气的琦玉老师
2020/03/02 日漫
收集的php编写大型网站问题集
2007/03/06 PHP
CodeIgniter中使用cookie的三种方式详解
2014/07/18 PHP
PHP实现支持SSL连接的SMTP邮件发送类
2015/03/05 PHP
php使用MySQL保存session会话的方法
2015/06/26 PHP
CodeIgniter框架实现的整合Smarty引擎DEMO示例
2019/03/28 PHP
Yii2框架中一些折磨人的坑
2019/12/15 PHP
JavaScript 常用函数库详解
2009/10/21 Javascript
js数字输入框(包括最大值最小值限制和四舍五入)
2009/11/24 Javascript
jQuery 选择器项目实例分析及实现代码
2012/12/28 Javascript
js读取被点击次数的简单实例(从数据库中读取)
2014/03/07 Javascript
JavaScript闭包函数访问外部变量的方法
2014/08/27 Javascript
详解AngularJS中的依赖注入机制
2015/06/17 Javascript
详解jQuery选择器
2016/12/21 Javascript
webpack打包单页面如何引用的js
2017/06/07 Javascript
jQuery实现的事件绑定功能基本示例
2017/10/11 jQuery
vue组件命名和props命名代码详解
2019/09/01 Javascript
JS实现判断移动端PC端功能
2020/02/21 Javascript
[02:31]《DAC最前线》之选手酒店现场花絮
2015/01/30 DOTA
[53:15]2018DOTA2亚洲邀请赛3月29日 小组赛A组 LGD VS TNC
2018/03/30 DOTA
[01:26]DOTA2荣耀之路2:iG,China
2018/05/24 DOTA
Python程序设计入门(4)模块和包
2014/06/16 Python
Python实现base64编码的图片保存到本地功能示例
2018/06/22 Python
Python制作exe文件简单流程
2019/01/24 Python
python实现输入的数据在地图上生成热力图效果
2019/12/06 Python
Pyspark读取parquet数据过程解析
2020/03/27 Python
python filecmp.dircmp实现递归比对两个目录的方法
2020/05/22 Python
利用CSS3实现动态的二级三级菜单效果实例源码
2017/01/04 HTML / CSS
美国网上鞋子零售商:Dr. Scholl’s Shoes
2017/11/17 全球购物
电大学习个人自我评价范文
2013/10/04 职场文书
国际商务系学生个人的自我评价
2013/11/26 职场文书
出纳员的岗位职责
2014/02/22 职场文书
毕业生找工作求职信
2014/08/05 职场文书
出租房屋协议书
2014/09/14 职场文书
关于感恩的歌曲整理(8首)
2019/08/14 职场文书
python基于tkinter实现gif录屏功能
2021/05/19 Python