javascript实现动态模态绑定grid

最新推荐文章于 2020-11-03 18:58:55 发布

Kilin_Zhang

最新推荐文章于 2020-11-03 18:58:55 发布

阅读量682

点赞数

分类专栏： Javascript + html + css 文章标签： javascript grid 模板动态table

本文链接：https://blog.csdn.net/zhang_7150/article/details/39474177

版权

<html>
<head>
	<style type="text/css">
		.grid{border:1px solid #808080; border-spacing:0; width:500px; border-collapse:collapse}
		.grid th,.grid td{border:0; text-align:center;}
		.grid tr{height:25px;line-height:25px;}
		.grid tr.odd{background:#d0d0d0}
		.grid .btn{width:80px; text-align:center}		
	</style>
	
	<script type="text/javascript">
		(function(){
			//
			var util = {
				next:function next(ele){
					if(ele){
						var n = ele.nextSibling;
						if(n && n.nodeType === 1){
							return n;
						}
						return next(n);
					}
				},
				parseJSON:function(str){
					if(typeof JSON !== "undefined"){
						return JSON.parse(str);
					}
					return eval("("+str+")");
				},
				parseArray:function(obj){
					if(!obj){
						return obj;
					}
					var result = [];
					if(typeof obj.length !== "undefined"){
						try{
							var arr = Array.prototype.slice.call(obj,0);
							result = arr;
						}catch(e){
							for(var i=0;i<obj.length;i++){
								try{
									var target = obj[i];
								}catch(e){
									if(obj.item){
										var target = this.item(i);//nodeList
									}
								}
								if(typeof target !== "undefined"){
									result.push(target);
									delete target;
								}
							}
						}
					}
					return result;
				},
				isFunction:function(fn){
					return typeof fn === "function";
				},
				trim:function(str){
					if(typeof str !== "string"){
						return str;
					}
					return str.replace(/^\s+|\s+$/g,"");
				},
				offset:function offset(ele){
					var result = {top:0,left:0};
					if(!ele || ele.nodeType !== 1){
						return result;
					}
					result.top = Number(ele.offsetTop || (ele.style.top || "0").replace(/[^\d]+$/,""));
					result.left = Number(ele.offsetLeft || (ele.style.left || "0").replace(/[^\d]+$/,""));
					if(ele.parentNode){
						var r = offset(ele.parentNode);
						result.top += r.top;
						result.left += r.left;
					}
					return result;
				}
			};
			
			//事件处理
			var Event = {
				on:function(eventType,fn){
					var element = this;
					if(this.addEventListener){
						this.addEventListener(eventType,fn,false);
					}else if(this.attachEvent){
						 //将事件缓冲到该标签上,已解决this指向window(现fn内this指向element)和移除匿名事件问题						 
						var _EventRef='_'+eventType+'EventRef';
						if(!element[_EventRef]){
							element[_EventRef]=[];
						}
						var _EventRefs=element[_EventRef];
						var index;
						for(index in _EventRefs){
							if(_EventRefs[index]['realFn']==fn){
								return;
							}
						}
						var nestFn=function(){
							fn.apply(element,arguments);
						};
						element[_EventRef].push({'realFn':fn,'nestFn':nestFn});
						element.attachEvent('on'+eventType,nestFn);
					}					
				},
				remove:function(eventType,fn){			
					var element = this;		
					if(this.removeEventListener){
						this.removeEventListener(eventType,fn,false);
					}else if(this.detachEvent){
						var _EventRef='_'+eventType+'EventRef';
						if(!element[_EventRef]){
							element[_EventRef]=[];
						}
						var _EventRefs=element[_EventRef]
						var index;
						var nestFn;
						for(index in _EventRefs){
							if(_EventRefs[index]['realFn']==fn){
								nestFn=_EventRefs[index]['nestFn'];
								if(index==_EventRefs.length-1){
									element[_EventRef]=_EventRefs.slice(0,index);
								}else{
									element[_EventRef]=_EventRefs.slice(0,index).concat(_EventRefs.slice(index+1,_EventRefs.length-1));
								}
								break;
							}
						}
						if(nestFn){
							element.detachEvent('on'+eventType,nestFn);
						}
					}
				}
			};
			
			//extend
			(function()

最低0.47元/天解锁文章

Kilin_Zhang

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript实现动态模态绑定grid

.grid{border:1px solid #808080; border-spacing:0; width:500px; border-collapse:collapse} .grid th,.grid td{border:0; text-align:center;} .grid tr{height:25px;line-height:25px;} .grid tr.odd{back
复制链接

扫一扫