Posted in Javascript onDecember 23, 2009
//处理页面异常 function Exception() { } //页面元素共同接口 function View() { //页面元素 this.element = null; //文字颜色 this.color = null; //设置样式 this.setStyle = function(name, value) { eval("this.element.style." + name + " = '" + value + "'"); } //获取样式 this.getStyle = function(name) { return eval("this.element.style." + name); } //设置浮动样式 this.setFloat = function(styleFloat) { this.setStyle("styleFloat", styleFloat); } //设置背景色 this.setBackgroundColor = function(backgroundColor) { this.setStyle("backgroundColor", backgroundColor); } //获取背景色 this.getBackgroundColor = function() { return this.getStyle("backgroundColor"); } //设置对象宽度 this.setWidth = function(width) { //alert(width); this.setStyle("width", width); } //设置对象宽度 this.setHeight = function(height) { this.setStyle("height", height); } //设置页面定位 this.setPosition = function(position) { this.setStyle("position", position); } //设置层 this.setZIndex = function(zIndex) { this.setStyle("zIndex", zIndex); } //左边距离 this.setLeft = function(left) { this.setStyle("left", left); } //上边距离 this.setTop = function(top) { this.setStyle("top", top); } //是否换行 this.setWhiteSpace = function(whiteSpace) { this.setStyle("whiteSpace", whiteSpace); } this.setMargin = function(margin) { this.setStyle("margin", margin); } this.setPadding = function(padding) { this.setStyle("padding", padding); } //设置属性 this.setAttributeIsHave = function(attrName, value) { eval("this.element.setAttribute('" + attrName + "', '" + value + "')"); } this.setId = function(id) { this.setAttributeIsHave("id", id); } this.setInnerText = function(innertext) { this.setAttributeIsHave("innerText", innertext); } //加入自定义属性 this.setAttributeIsNot = function(attrName, value) { var attr = document.createAttribute(attrName); attr.value = value; this.element.setAttributeNode(attr); } //事件监听 this.eventListener = function(eventName, exec) { this.element.attachEvent(eventName, exec); } //鼠标移入对象事件 this.onmouseenterListener = function(exec) { this.eventListener("onmouseenter", exec); } //鼠标移出对象事件 this.onmouseleaveListener = function(exec) { this.eventListener("onmouseleave", exec); } //鼠标单击对象事件 this.onclickListener = function(exec) { this.eventListener("onclick", exec); } } //单一元素 function Single() { View.call(this); } //可以有子元素 function Multi() { View.call(this); //子元素集合 this.childElementList = new Array(); //加入子元素 this.addView = function(childElement) { if(this.element == null) { //待加入异常信息 return; } this.childElementList[this.childElementList.length] = childElement; } //关联子元素 this.appendChildElement = function(childElement) { this.element.appendChild(childElement.element); } //显示元素 this.show = function() { for(var i = 0; i < this.childElementList.length; i++) { var childElement = this.childElementList[i]; this.appendChildElement(childElement); childElement.show(); } } } //面板 function Panel() { Multi.call(this); //创建页面元素 this.element = document.body; } //行布局 function LineLayout() { Multi.call(this); this.element = document.createElement("div"); } //左布局 function LeftLayout() { Multi.call(this); this.element = document.createElement("div"); this.setFloat("left"); } //右布局 function RightLayout() { Multi.call(this); this.element = document.createElement("div"); this.setFloat("right"); } function Menu() { Multi.call(this); this.element = document.createElement("div"); this.setWidth("100%"); var clickListener = function() { return; }; var moveInBackgroundColor = "red"; var moveOutBackgroundColor = this.getBackgroundColor(); this.show = function() { var menuItem = null; var menuEntiy = null; for(var i = 0; i < this.childElementList.length; i++) { menuItem = new MenuItem(); menuEntiy = this.childElementList[i]; menuItem.addMenuEntity(menuEntiy); menuItem.onmouseenterListener(moveInMenuItem); menuItem.onmouseleaveListener(moveOutMenuItem); menuItem.onclickListener(this.clickMenuItem ); menuItem.setPadding("0 5px 0 5px"); this.appendChildElement(menuItem); } } this.setClickListener = function(exec) { clickListener = exec; } function moveInMenuItem() { event.srcElement.style.backgroundColor = moveInBackgroundColor; } function moveOutMenuItem() { event.srcElement.style.backgroundColor = moveOutBackgroundColor; } this.clickMenuItem = function() { var child = clickListener(); document.body.appendChild(child.element); child.setLeft(event.srcElement.offsetLeft); child.setTop(event.srcElement.offsetParent.offsetTop + event.srcElement.clientHeight); child.show(); } } function ChildMenu() { Multi.call(this); this.element = document.createElement("div"); this.setPosition("absolute"); this.setZIndex(100); this.setBackgroundColor("#ccffcc"); var moveInBackgroundColor = "red"; var moveOutBackgroundColor = this.getBackgroundColor(); this.show = function() { var menuItem = null; var menuEntiy = null; for(var i = 0; i < this.childElementList.length; i++) { menuItem = new MenuItem(); menuItem.setFloat("none"); menuEntiy = this.childElementList[i]; menuItem.addMenuEntity(menuEntiy); menuItem.onmouseenterListener(moveInMenuItem); menuItem.onmouseleaveListener(moveOutMenuItem); //menuItem.onclickListener(clickMenuItem); menuItem.setPadding("0 5px 0 15px"); this.appendChildElement(menuItem); } } function moveInMenuItem() { event.srcElement.style.backgroundColor = moveInBackgroundColor; } function moveOutMenuItem() { event.srcElement.style.backgroundColor = moveOutBackgroundColor; } } function MenuEntiy(id, name, action) { this.id = id; this.name = name ; this.action = action; } function MenuItem() { Single.call(this); this.element = document.createElement("div"); this.setFloat("left"); this.setWhiteSpace("nowrap"); this.addMenuEntity = function(menuEntity) { this.setId(menuEntity.id); this.setInnerText(menuEntity.name); this.setAttributeIsNot("action", menuEntity.action); } }
window.js 主要包含了页面的一些操作
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@