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 相关文章推荐
HTML TO JavaScript 转换
Jun 26 Javascript
jquery键盘事件介绍
Jan 31 Javascript
写了10年的Javascript也未必全了解的连续赋值运算
Mar 25 Javascript
Js 获取Gridview选中行的内容操作步骤
Feb 05 Javascript
如何判断微信内置浏览器(通过User Agent实现)
Sep 01 Javascript
JavaScript DOM进阶方法
Apr 13 Javascript
JS+CSS实现鼠标滑过时动态翻滚的导航条效果
Sep 24 Javascript
详解 vue better-scroll滚动插件排坑
Feb 08 Javascript
BootStrap table实现表格行拖拽效果
Dec 01 Javascript
通过seajs实现JavaScript的模块开发及按模块加载
Jun 06 Javascript
Javascript幻灯片播放功能实现过程解析
May 07 Javascript
vue实现多个echarts根据屏幕大小变化而变化实例
Jul 19 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
深入for,while,foreach遍历时间比较的详解
2013/06/08 PHP
php后门URL的防范
2013/11/12 PHP
PHP获取文件行数的方法
2015/06/10 PHP
详解WordPress中添加友情链接的方法
2016/05/21 PHP
PHP Primary script unknown 解决方法总结
2019/08/22 PHP
PHP基于phpqrcode类生成二维码的方法示例详解
2020/08/07 PHP
关于document.cookie的使用javascript
2008/04/11 Javascript
javascript在事件监听方面的兼容性小结
2010/04/07 Javascript
jQuery 获取对象 定位子对象
2010/05/31 Javascript
JavaScript闭包 懂不懂由你反正我是懂了
2011/10/21 Javascript
深入理解JavaScript系列(10) JavaScript核心(晋级高手必读篇)
2012/01/15 Javascript
js 判断一个元素是否在页面中存在
2012/12/27 Javascript
javascript中2个感叹号的用法实例详解
2014/09/04 Javascript
AngularJS API之copy深拷贝详解及实例
2016/09/14 Javascript
微信小程序 Button 组件详解及简单实例
2017/01/10 Javascript
js实现表格筛选功能
2017/01/18 Javascript
浅谈小程序 setData学问多
2019/02/20 Javascript
如何实现iframe父子传参通信
2020/02/05 Javascript
JavaScript异步操作的几种常见处理方法实例总结
2020/05/11 Javascript
学前端,css与javascript重难点浅析
2020/06/11 Javascript
深入理解python对json的操作总结
2017/01/05 Python
python简单线程和协程学习心得(分享)
2017/06/14 Python
python中enumerate() 与zip()函数的使用比较实例分析
2019/09/03 Python
Python Lambda函数使用总结详解
2019/12/11 Python
在python中求分布函数相关的包实例
2020/04/15 Python
Pymysql实现往表中插入数据过程解析
2020/06/02 Python
北美Newegg打造的全球尖货海购平台:tt海购
2018/09/28 全球购物
"引用"与多态的关系
2013/02/01 面试题
运动会解说词100字
2014/01/31 职场文书
终止劳动合同协议书
2014/04/14 职场文书
行政管理专业求职信
2014/07/06 职场文书
分公司总经理岗位职责
2014/08/03 职场文书
无违反计划生育证明格式
2015/06/24 职场文书
2016年6月份红领巾广播稿
2015/12/21 职场文书
教师法制教育培训学习心得体会
2016/01/14 职场文书
python使用XPath解析数据爬取起点小说网数据
2021/04/22 Python