JS做选项卡的类，哪个帮忙加个注释嘛。
前台BODY里面的代码，样式不用去管它
<body>
<div class="tabParentCss">
<div class="tabParentCssLeft">
</div>
<div class="tabParentCssMiddel" id="tabApplication">
<div class="newSelectedTabCss_1" istab="2" style="margin-top: 7px; padding-left: 7px;
padding-right: 7px; padding-top: 3px;" title="高考GPS">
选项1</div>
<div class="newSelectedTabCss" istab="1" style="margin-top: 7px; padding-left: 7px;
padding-right: 7px; padding-top: 3px;" title="高考GPS">
选项2</div>
<div class="newSelectedTabCss" istab="1" style="margin-top: 7px; padding-left: 7px;
padding-right: 7px; padding-top: 3px;" title="高考GPS">
选项3</div>
<div class="newSelectedTabCss" istab="1" style="margin-top: 7px; padding-left: 7px;
padding-right: 7px; padding-top: 3px;" title="高考GPS">
选项4</div>
</div>
<div class="tabParentCssRight">
</div>
<div class="bodyParentCss" style="padding-left:20px;">
数据加载中......
</div>
</div>
<script language="javascript" type="text/javascript">
(function () {
new applicationObject(document.getElementById("tabApplication"));
})();
</script>
</body>
JS里面的代码，好心人加个注释噻，表示看不明白
?function createDelegate(obj,exObj){
return function(){
exObj.apply(obj,arguments);
}
}
function addEventHander(obj,eventName,execMethed){
if(window.addEventListener){
obj.addEventListener(eventName,execMethed,false);
}else if(window.attachEvent){
obj.attachEvent("on"+eventName,execMethed);
}else{
obj["on"+eventName]=eventName;
}
}
function removeEventHander(obj,eventName,execMethed){
if(window.removeEventListener){
obj.removeEventListener(eventName,execMethed,false);
}else if(window.attachEvent){
obj.detachEvent("on"+eventName,execMethed);
}else{
obj["on"+eventName]=null;
}
}
function objParent(e){
if(window.event){
return e.srcElement;
}else{
returne.target;
}
}
function tabClickEvent(e){
var divObject=objParent(e);
for(var i=0;i<applicationClass.tabArray.length;i++){
removeEventHander(applicationClass.tabArray[i],"click",tabClickEvent);
if(applicationClass.tabArray[i]==divObject){
addEventHander(applicationClass.tabArray[i],"click",e);
applicationClass.tabArray[i].className="newSelectedTabCss_1";
}else{
addEventHander(applicationClass.tabArray[i],"click",tabClickEvent);
applicationClass.tabArray[i].className="newSelectedTabCss";
}
}
alert(divObject.innerHTML)
}
var applicationClass=null;
function applicationObject(){this.load.apply(this,arguments);}
applicationObject.prototype={
load:function(tabObject){
applicationClass=this;
this.tabObject=tabObject;
var getTabArray=this.tabObject.getElementsByTagName("div");
this.tabArray=new Array();
for(var i=0;i<getTabArray.length;i++){
if(getTabArray[i].getAttribute("isTab")=="1"||getTabArray[i].getAttribute("isTab")=="2"){
this.tabArray.push(getTabArray[i]);
if(getTabArray[i].getAttribute("isTab")=="1"){
addEventHander(getTabArray[i],"click",tabClickEvent);
}
}
}
}
}
[解决办法]
- JScript code
?function createDelegate(obj,exObj){ return function(){ exObj.apply(obj,arguments); }}function addEventHander(obj,eventName,execMethed){ //添加事件if(window.addEventListener){ //兼容判断 //IE //FFobj.addEventListener(eventName,execMethed,false); }else if(window.attachEvent){obj.attachEvent("on"+eventName,execMethed);}else{obj["on"+eventName]=eventName; }}function removeEventHander(obj,eventName,execMethed){ //移除事件if(window.removeEventListener){ //同上obj.removeEventListener(eventName,execMethed,false); }else if(window.attachEvent){obj.detachEvent("on"+eventName,execMethed);}else{obj["on"+eventName]=null; }}function objParent(e){if(window.event){ //兼容判断 return e.srcElement; //返回事件的源对象 //ie }else{return e.target; //ff}}function tabClickEvent(e){var divObject=objParent(e);for(var i=0;i<applicationClass.tabArray.length;i++){removeEventHander(applicationClass.tabArray[i],"click",tabClickEvent);if(applicationClass.tabArray[i]==divObject){addEventHander(applicationClass.tabArray[i],"click",e); applicationClass.tabArray[i].className="newSelectedTabCss_1"; }else{addEventHander(applicationClass.tabArray[i],"click",tabClickEvent); applicationClass.tabArray[i].className="newSelectedTabCss"; }} alert(divObject.innerHTML)}var applicationClass=null;function applicationObject(){this.load.apply(this,arguments);}applicationObject.prototype={load:function(tabObject){applicationClass=this;this.tabObject=tabObject;var getTabArray=this.tabObject.getElementsByTagName("div");this.tabArray=new Array();for(var i=0;i<getTabArray.length;i++){if(getTabArray[i].getAttribute("isTab")=="1"||getTabArray[i].getAttribute("isTab")=="2"){this.tabArray.push(getTabArray[i]);if(getTabArray[i].getAttribute("isTab")=="1"){addEventHander(getTabArray[i],"click",tabClickEvent); }}}}}
[解决办法]
调了一下可以运行了：
- HTML code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>无标题页</title></head><body> <form id="form1" runat="server"> <div class="tabParentCss"> <div class="tabParentCssLeft"> </div> <div class="tabParentCssMiddel" id="tabApplication"> <div class="newSelectedTabCss_1" istab="2" style="margin-top: 7px; padding-left: 7px; padding-right: 7px; padding-top: 3px;" title="高考GPS"> 选项1</div> <div class="newSelectedTabCss" istab="1" style="margin-top: 7px; padding-left: 7px; padding-right: 7px; padding-top: 3px;" title="高考GPS"> 选项2</div> <div class="newSelectedTabCss" istab="1" style="margin-top: 7px; padding-left: 7px; padding-right: 7px; padding-top: 3px;" title="高考GPS"> 选项3</div> <div class="newSelectedTabCss" istab="1" style="margin-top: 7px; padding-left: 7px; padding-right: 7px; padding-top: 3px;" title="高考GPS"> 选项4</div> </div> <div class="tabParentCssRight"> </div> <div class="bodyParentCss" style="padding-left: 20px;"> 数据加载中...... </div> </div> </form> <script language="javascript" type="text/javascript"> var applicationClass=null; function applicationObject(){this.load.apply(this,arguments);} applicationObject.prototype={//属性 load:function(tabObject){ applicationClass=this; this.tabObject=tabObject; var getTabArray=this.tabObject.getElementsByTagName("div"); this.tabArray=new Array(); for(var i=0;i<getTabArray.length;i++){ if(getTabArray[i].getAttribute("isTab")=="1"||getTabArray[i].getAttribute("isTab")=="2"){ this.tabArray.push(getTabArray[i]); if(getTabArray[i].getAttribute("isTab")=="1"){ addEventHander(getTabArray[i],"click",tabClickEvent); } } } } } function createDelegate(obj,exObj){ //创建委托 return function(){ exObj.apply(obj,arguments); } } function addEventHander(obj,eventName,execMethed){//添加事件 if(window.addEventListener){ obj.addEventListener(eventName,execMethed,false); }else if(window.attachEvent){ obj.attachEvent("on"+eventName,execMethed); }else{ obj["on"+eventName]=eventName; } } function removeEventHander(obj,eventName,execMethed){//移除事件 if(window.removeEventListener){//监听 obj.removeEventListener(eventName,execMethed,false); }else if(window.attachEvent){//附加 obj.detachEvent("on"+eventName,execMethed); }else{ obj["on"+eventName]=null; } } function objParent(e){//兼容性 if(window.event){ return e.srcElement; }else{ return e.target; } } function tabClickEvent(e){//事件触发 var divObject=objParent(e); for(var i=0;i<applicationClass.tabArray.length;i++){ removeEventHander(applicationClass.tabArray[i],"click",tabClickEvent); if(applicationClass.tabArray[i]==divObject){ addEventHander(applicationClass.tabArray[i],"click",e); applicationClass.tabArray[i].className="newSelectedTabCss_1"; }else{ addEventHander(applicationClass.tabArray[i],"click",tabClickEvent); applicationClass.tabArray[i].className="newSelectedTabCss"; } } //alert(divObject.innerHTML); } (function () { new applicationObject(document.getElementById("tabApplication"));//创建applicationObject实例 })(); </script></body></html>