Question

我已经看过这段代码，我一遍又一遍地写，但似乎无法找到问题所在。我要做的是在屏幕上显示一个滑动条，就像健康/法力吧一样。这是我用来创建栏的功能：

function makeBar(max,color,place){
    b=new Object();
    len=bar.length;
    bar.push(b);
    b.index=len;
    b.place=place;
    b.color=color;
    b.max=max;
    b.val=max;
    b.print=function(){
        this.place.innerHTML+="<div id='bar"+this.index+"' style='display:inline-block;text-align:center;height:40px;width:200px;border:3px outset black;'><div id='subBar"+this.index+"' style='font-size:20pt;height:34px;width:1px;background:"+this.color+";border:3px outset "+this.color+";'></div></div>";
        this.container=document.getElementById('bar'+this.index);
        this.content=document.getElementById('subBar'+this.index);
    }
    b.refresh=function(){
        this.content.style.width=(this.val/this.max)*194+"px";
    }
    b.print();
}

因此它可以完美地'打印'吧。但是当我尝试使用

时

bar[0].refresh();

除非bar [0]是唯一的栏，否则它什么都不做。基本上，只有最后创建的栏可以成功使用自己的refresh（）方法。谁能帮我？ Thanx every1

Answer 1

对象B刷新功能吗？您可以尝试制作＆＃34; b＆＃34;作为全局变量而不是在本地使用它。

即。

 var b;
function makeBar(max,color,place){
 b=new Object();
 len=bar.length;
 //bar.push(b);  don't push here
 b.index=len;
 b.place=place;
 b.color=color;
 b.max=max;
 b.val=max;
 b.print=function(){
    this.place.innerHTML+="<div id='bar"+this.index+"' style='display:inline-block;text-align:center;height:40px;width:200px;border:3px outset black;'><div id='subBar"+this.index+"' style='font-size:20pt;height:34px;width:1px;background:"+this.color+";border:3px outset "+this.color+";'></div></div>";
    this.container=document.getElementById('bar'+this.index);
    this.content=document.getElementById('subBar'+this.index);
}
b.refresh=function(){
    this.content.style.width=(this.val/this.max)*194+"px";
}
b.print();
}

如果你想使用对象b的单个实例，那么不要使用数组。直接致电b.refresh()。

我在制作/更新HTML元素时遇到问题.- Javascript

1 个答案: