CSDN-CSDN社区-Web 开发-JavaScript

收藏 setInterval参数与Javascript类的问题[问题点数:20,结帖人:wangbin20001216]

楼主发表于:2007-04-21 16:30:27
我是一个菜鸟,我做了一段代码,但老是出问题.
这个CASE是这样个的.就是我一点 "开始 "线的宽度就开始增加,一点 "停止 "就停止.
附代码如下:请高手帮忙.
<html>
<head>
<meta   http-equiv= "Content-Type "   content= "text/html;   charset=gb2312 ">
<title> Write   The   Codes   By   Myself </title>
<script   language= "javascript ">
<!--hidden
  function   cl()
  {
      this.timer=null;  
    }
  cl.prototype.st=function(n){this.timer=window.setInterval( "this.add( ' "+n+ " ') ",100);}
  cl.prototype.add=function(n)
  {
      var   obj=document.getElementById(n);
      obj.style.width=parseInt(obj.style.width)+10;
    }
  cl.prototype.stoped=function()   {   window.clearInterval(this.timer);     }
  var   my=new   cl();
 
-->
</script>

</head>

<body>
<hr   style= "width:10px "   id= "line ">
<form>
    <input   type= "button "   name= "Submit "   value= "开始 "   onClick= "javascript:my.st( 'line '); ">
    <input   type= "button "   name= "Submit2 "   value= "停止 "   onClick= "javascript:my.stoped(); ">
</form>
</body>
</html>
回复次数:5
#1楼 得分:10回复于:2007-04-21 17:05:51
<html>
<head>
<meta   http-equiv= "Content-Type "   content= "text/html;   charset=gb2312 ">
<title> Write   The   Codes   By   Myself </title>
<script   language= "javascript ">
<!--hidden
function   cl()
{
this.timer=null;
}
cl.prototype.st=function(n){
var   cc   =   this;
var   c   =   function   (){   cc.add(n)   ;   };
this.timer=window.setInterval(c,100);
}
cl.prototype.add=function(n)
{
var   obj=document.getElementById(n);
obj.style.width=parseInt(obj.style.width)+10;
}
cl.prototype.stoped=function()   {
window.clearInterval(this.timer);
}
var   my=new   cl();

-->
</script>

</head>

<body>
<hr   style= "width:10px "   id= "line ">
<form>
    <input   type= "button "   name= "Submit "   value= "开始 "   onClick= "javascript:my.st( 'line '); ">
    <input   type= "button "   name= "Submit2 "   value= "停止 "   onClick= "javascript:my.stoped(); ">
</form>
</body>
</html>
#2楼 得分:4回复于:2007-04-21 17:10:28
<html>
<head>
<meta   http-equiv= "Content-Type "   content= "text/html;   charset=gb2312 ">
<title> Write   The   Codes   By   Myself </title>
<script   language= "javascript ">
<!--hidden
  function   cl()
  {
      this.timer=null;  
    }
  cl.prototype.st=function(n){this.timer=window.setInterval( "my.add( ' "+n+ " ') ",100);}
  cl.prototype.add=function(n)
  {
      var   obj=document.getElementById(n);
      obj.style.width=parseInt(obj.style.width)+10;
    }
  cl.prototype.stoped=function()   {   window.clearInterval(this.timer);     }
  var   my=new   cl();
 
-->
</script>

</head>

<body>
<hr   style= "width:10px "   id= "line ">
<form>
    <input   type= "button "   name= "Submit "   value= "开始 "   onClick= "javascript:my.st( 'line '); ">
    <input   type= "button "   name= "Submit2 "   value= "停止 "   onClick= "javascript:my.stoped(); ">
</form>
</body>
</html>
#3楼 得分:2回复于:2007-04-21 17:14:07
cl.prototype.st=function(n){this.timer=window.setInterval( "this.add( ' "+n+ " ') ",100);}
这句话有问题,在window执行this.add的时候,这个this并不是你所想的my对象,而是window(window.setInterval这个方法是属于window的,这个方法里用this当然也是指向window的)。只要改成对象引用就好了,my.add。
#4楼 得分:4回复于:2007-04-21 17:19:49
也许用setTimeout更好:
<html>
<head>
<meta   http-equiv= "Content-Type "   content= "text/html;   charset=gb2312 ">
<title> Write   The   Codes   By   Myself </title>
<script   language= "javascript ">
<!--hidden
function   cl(){
this.timer   =   null;
}
cl.prototype.add   =   function(n){
var   obj   =   document.getElementById(n);
obj.style.width   =   parseInt(obj.style.width)+10;
cl.prototype.timer   =   window.setTimeout(function(){cl.prototype.add(n)},1000);
}
cl.prototype.stoped   =   function(){
if(cl.prototype.timer!=null){
window.clearTimeout(cl.prototype.timer);
}
cl.prototype.timer   =   null;
}

var   my   =   new   cl();
 
-->
</script>

</head>

<body>
<hr   style= "width:10px "   id= "line ">
<form>
    <input   type= "button "   name= "Submit "   value= "开始 "   onClick= "javascript:my.add( 'line '); ">
    <input   type= "button "   name= "Submit2 "   value= "停止 "   onClick= "javascript:my.stoped(); ">
</form>
</body>
</html>
#5楼 得分:0回复于:2007-04-24 10:13:27
谢谢楼上的各位朋友帮忙,同时感谢adverse(King)还给我介绍了一些原理的知识.谢谢.向你们学习.我采用了zhaoxiaoyang(梅雪香@深圳)   的方法,因为跟我最近学的比较一致.再次感谢.

dh20156(风之石)   给我推荐的setTimeout是我学习的下一个命令.我会串通学习的.

我是新手,给分怎么给呀?
相关问题
请教高手关于setInterval里如何传递参数Web 开发/ JavaScript - CSDN ...
为什么报参数无效的错啊highlighting=window.setInterval(highlightit ...
javascript的setInterval如何传递参数?
setInterval()问题,谢谢! Web 开发/ JavaScript - CSDN社区community ...
菜鸟级问题,关于函数参数Web 开发/ JavaScript - CSDN社区community ...
setInterval()中作为参数的函数不能带参数吗? Web 开发/ JavaScript ...