Javascript构造对象化类,但是不是想要的样子,三个DIV,只有一个加上了事件,其它两个无效,这个Js类如何修改才能正常<!--Test.html --><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>Test</title>
<script type="text/javascript" src="/Scripts/Base.js"></script>
<script type="text/javascript" src="Test.js"></script>
<style type="text/css">
div
{
background:#ccf;
padding:12px;
border:1px solid #99f;
margin-top:1px;
}
</style>
</head>
<body>
<div id="Rpt">A:现在只有这个DIV加了点击事件</div>
<div id="Div1">B:这个DIV没加上点击事件</div>
<div id="Div2">C:这个DIV没加上点击事件</div>
<script type="text/javascript">
new Ap("Rpt");
new Ap("Div1");
new Ap("Div2");
</script>
</body>
</html><!--Test.js -->function Ap(Id)
{
var Rpt=document.getElementById(Id);
this.Sex="男";
if(typeof Ap.Initialized == "undefined")
{
Ap.prototype.CldC=function()
{
Ap.apply(this);
Rpt.innerHTML+="<br />Class method<br />"+this.Sex;
}
Rpt.onclick=this.CldC;
Ap.Initialized=true;
}
}/* 这样就不行
function Ap(Id)
{
this.Rpt=document.getElementById(Id);
this.Sex="男";
if(typeof Ap.Initialized == "undefined")
{
Ap.prototype.CldC=function()
{
this.Rpt.innerHTML+="<br />Class method<br />"+this.Sex;
}
this.Rpt.onclick=this.CldC;
Ap.Initialized=true;
}
}
*/
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>Test</title>
<script type="text/javascript" src="/Scripts/Base.js"></script>
<script type="text/javascript" src="Test.js"></script>
<style type="text/css">
div
{
background:#ccf;
padding:12px;
border:1px solid #99f;
margin-top:1px;
}
</style>
</head>
<body>
<div id="Rpt">A:现在只有这个DIV加了点击事件</div>
<div id="Div1">B:这个DIV没加上点击事件</div>
<div id="Div2">C:这个DIV没加上点击事件</div>
<script type="text/javascript">
new Ap("Rpt");
new Ap("Div1");
new Ap("Div2");
</script>
</body>
</html><!--Test.js -->function Ap(Id)
{
var Rpt=document.getElementById(Id);
this.Sex="男";
if(typeof Ap.Initialized == "undefined")
{
Ap.prototype.CldC=function()
{
Ap.apply(this);
Rpt.innerHTML+="<br />Class method<br />"+this.Sex;
}
Rpt.onclick=this.CldC;
Ap.Initialized=true;
}
}/* 这样就不行
function Ap(Id)
{
this.Rpt=document.getElementById(Id);
this.Sex="男";
if(typeof Ap.Initialized == "undefined")
{
Ap.prototype.CldC=function()
{
this.Rpt.innerHTML+="<br />Class method<br />"+this.Sex;
}
this.Rpt.onclick=this.CldC;
Ap.Initialized=true;
}
}
*/
{
this.Rpt=document.getElementById(Id);
this.Sex="男";
var pThis = this;
this.Rpt.onclick = function(){
pThis.Rpt.innerHTML+="<br />Class method<br />"+pThis.Sex;
};
}
用一个pThis来持久Ap元素即可
下面是我按JKelfin的方法用变量Roll保存了Rolls对象
function Rolls(Id, Speed){
var C = new Cm();
this.Wrap = C.G(Id);
this.Original = C.Gs(this.Wrap, "div")[0];
this.Ectype = this.Original.cloneNode(true);
this.Wrap.appendChild(this.Ectype);
var Roll=this;
if(typeof Rolls.Initialized == "undefined")
{
Rolls.prototype.Marquee=function()
{
//向左滚动
if (Roll.Wrap.scrollLeft >= Roll.Original.offsetWidth)
{
Roll.Wrap.scrollLeft -= Roll.Original.offsetWidth;
}
else
{
Roll.Wrap.scrollLeft++;
}
//向上滚动
if (Roll.Wrap.scrollTop >= Roll.Original.offsetHeight)
{
Roll.Wrap.scrollTop -= Roll.Original.offsetHeight;
}
else
{
Roll.Wrap.scrollTop++;
}
};
var MyMarquee = setInterval(Roll.Marquee, Speed);
C.AddEvent(Roll.Wrap, "mouseover", function(){clearInterval(MyMarquee);});
C.AddEvent(Roll.Wrap, "mouseout", function(){MyMarquee = setInterval(Roll.Marquee, Speed);});
Rolls.Initialized=true;
}
}
function Cm()
{
this.BdTop = document.body.scrollTop || document.documentElement.scrollTop;
this.Fh = document.body.clientHeight;
if(typeof Cm.Initialized=="undefined")
{
Cm.prototype.Sw = screen.availWidth;
Cm.prototype.Sh = screen.availHeight;
Cm.prototype.G=function(id)
{
return document.getElementById(id);
};
Cm.prototype.Gs = function (prt, tg)
{
var prt = typeof (prt) == "string" ? Cm.prototype.G(prt) : prt,
Childs = new Array(),
Ds = prt.getElementsByTagName(tg);
for (var i = 0; i < Ds.length;i++)
{
if (Ds[i].parentNode == prt)
{
Childs.push(Ds[i]);
}
}
return Childs;
};
Cm.prototype.AddEvent = function (obj, ev, fn)
{
if (window.addEventListener)
{
obj.addEventListener(ev, fn, false);
}
else if (window.attachEvent)
{
obj.attachEvent("on" + ev, fn);
}
else
{
obj["on" + ev] = fn;
} };
Cm.prototype.DelEvent=function(obj, ev, fn)
{
if(window.removeEventListener)
{
obj.removeEventListener(ev,fn,false);
}
else if(window.detachEvent)
{
obj.detachEvent("on"+ev,fn);
}
else
{
obj["on"+ev]=null;
}
};
Cm.prototype.DelClass=function(M)
{
if(M.getAttribute("class"))
{
M.removeAttribute("class");
}
else if(M.getAttribute("className"))
{
M.removeAttribute("className");
}
}
Cm.prototype.DelStyle = function (C)
{
if (C.getAttribute("style"))
{
C.removeAttribute("style");
}
else if (C.attributes["style"])
{
C.removeAttributeNode(C.attributes["style"]);
}
};
Cm.Initialized=true;
}
}
new Rolls("LMar",100);
new Rolls("TMar",100);
但是只有一个能正常运行,不知道是哪里的问题,纠结中ing...