摘要：长时间做JS开发，经常需要对DOM中元素，例如A,DIV ,INPUT 进行事件绑定，通常的做法是在页面HTML渲染完成之后，再逐个绑定事件.比如，使用jQuery 绑定的click方法。$(‘.fix , .del , .view’).die(“click”).live(“click”,function(){alert(”)});然而，当再对代码进行维护时，看到这样的代码，再去dom中查找对象，就增加了维护难度。而且这些方法主要实现了什么功能，也只能是通过阅读代码来实现。另外，从代码结构上来看，UI与事件处理的逻辑耦合过于紧密，当dom中因为修改样式而换一个class名或者name名而未修改 阅读全文
诡异的<input type="file">
2013-01-08 10:31 by chris-shao, 1160 阅读, 0 推荐, 收藏, 编辑
摘要：1.如何兼容所有浏览器隐藏此控件，并能正确触发选择文件的事件。原理：将一个File 组件放置于下层，设置透明度为0，然后在其上层放置一个设置了背景（选择文件的按钮图）的SPAN 或DIV的空对象，当点击这个空的DIV时，事件将向下传递，就会触发File的点击事件。实现：HTML:<div class="img_panel img_panel_middle"> <div class="uploadcontainer"> <input type="file" class="uploadfile&qu 阅读全文
JS 获取跨域的cookie.
2012-12-27 16:46 by chris-shao, 2766 阅读, 0 推荐, 收藏, 编辑
摘要：JS 获取跨域cookie? 简直是疯了。这怎么可能，不过在条件允许的情况下（两个域内文件都可以自定义），如下有一个方案。一共需要3个文件，第一个文件为需要获取cookie的页面，在这个页面内嵌入存在网站B的获取cookie的代码，第二个文件存在网站B，读取cookie，然后将自身URL修改为网站A域下，并将cookie拼接到URL中，第三个文件在网站A，用于调用父页面处理得到的cookie.代码如下：文件一：假设为网站A下.1.html<html><head></head><body><iframe src='http://B.c 阅读全文
jQuery 框架框架模拟方案
2012-07-25 21:19 by chris-shao, 140 阅读, 0 推荐, 收藏, 编辑
摘要：(function(){varinit=function(s){this.s=s;}vara=function(s){returnnewinit(s);}a.fn=init.prototype;window.$$=a;})();$$.fn.test=function(){alert(this.s);returnthis;};varsss=$$("teststr").test().test();$$.test=function(s){alert(s);}$$.test("bbb");主要用于实现对象继承以及静态方法扩展。 阅读全文
在Sprite 基础之上创建一个既可以控制移动，也可以动画的对象定义。
2012-07-06 14:00 by chris-shao, 135 阅读, 0 推荐, 收藏, 编辑
摘要：<html><scriptsrc="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script><script>$(document).ready(function(){varDHTMLSprite=function(params){varwidth=params.width,height=params.height,imagesWidth=params.imagesWidth,$element=params.$drawTarget.app 阅读全文
Javascript 创建一个动画元件的代码
2012-07-06 11:33 by chris-shao, 178 阅读, 0 推荐, 收藏, 编辑
摘要：varDHTMLSprite=function(params){varwidth=params.width,height=params.height,imagesWidth=params.imagesWidth,$element=params.$drawTarget.append("<div/>").find(':last'),elementStyle=$element[0].style,mathFloor=Math.floor;$element.css({position:'absolute',width:width,heigh 阅读全文
通用遮罩层jQuery 扩展。
2012-06-26 12:15 by chris-shao, 213 阅读, 0 推荐, 收藏, 编辑
摘要：可以遮罩页面上任意一个元素。(function($){var_mask=function(settings){vardefaults={maskid:"mask",html:""};$.extend(defaults,settings);varheight=this[0]===window?document.body.clientHeight:this.height();varwidth=this[0]===window?document.body.clientWidth:this.width();vartop=this[0]===window?0:th 阅读全文
巧妙的javascript 正则表达式替换字符串
2012-06-13 10:26 by chris-shao, 376 阅读, 0 推荐, 收藏, 编辑
摘要：<script>varobj={};obj["123"]='123的替换';obj["456"]='456的替换';vars="abc@123@def@456@";varMarker='\@';s=s.replace(newRegExp(Marker+'([^@]*?)'+Marker,'g'),function(m,$1){alert(m);returnobj[$1];})alert(s);</script> 阅读全文
Javascript MVC 翻页控件 版本二
2012-06-07 16:24 by chris-shao, 414 阅读, 0 推荐, 收藏, 编辑
摘要：本版本实现了令一个版本的翻页控件，突出MVC结构，抽象通用的基础类为xComponent，继承xComponent实现的Pager将实现render，并自定义添加事件。以及事件方法。重新更新：将view提取出来单独设计。这样view就可以面向显示。moduler描述对象。 <script>varxComponent=function(module,container,view){this.view=view;this.Module=module;this.container=container||this.container;this.events={};this.addEvent 阅读全文
JAVASCRIPT 面向对象编程 通用翻页控件
2012-06-02 20:18 by chris-shao, 1811 阅读, 1 推荐, 收藏, 编辑
摘要：JAVASCRIPT编程现在在网页前端中越来越占有更高比重。 也试着实现一个易扩展的JAVASCRIPT 类，在核心类中不依赖类库，另外，可以将此类作为jQuery的扩展使用。注：本代码在Firefox. IE 9 标准模式中测试通过，。 核心类代码如下：1/*2通用翻页Javascript控件3功能：提供通用的javascript控制4特点：面向对象编程，提供翻页控件原型，易扩展,基于事件扩展5开发：ChirsShao6日期：2012-6-27*/8//Pager构造函数9varPager=function(/*记录总数*/args){10if(typeofargs=="numbe 阅读全文