小编Sir*_*Sir的帖子

Onclick仅在循环中添加到最后一个元素

可能重复:
在for循环中分配单击处理程序

我的代码中需要一个循环的帮助.

我遍历一个数组并添加点击div.但它总是在循环的最后一个循环中添加onclicks并有效地取消之前的循环.

所以我把它作为我的循环:

    start = 0;

for(i = start; i < (start+8); i++){ //8 per page
    if(i == array.length){ 
        break;  //page end
    } else {
        (function(i){
             document.getElementById('cell'+i).onclick = function(){ select(i); }
        })(i);  
    }
}
Run Code Online (Sandbox Code Playgroud)

什么发生在这里是DIV ID cell7获取上点击添加,但div编号cell0至cell6没有.我猜它与i循环中的变化这样的事实有关,这也影响i了函数?

我该如何解决这个问题?

javascript

6
推荐指数
1
解决办法
3324
查看次数

在圆圈内随机绘制点的最简单方法

我有一个基本的JSFiddle,我希望在圆圈内绘制随机点.

但我不知道如何限制圆圈内的点数.

这就是我目前拥有的:

var ctx = canvas.getContext('2d'),
    count = 1000, // number of random  points
    cx = 150,
    cy = 150,
    radius = 148;

    ctx.beginPath();
    ctx.moveTo(cx, cy);
    ctx.arc(canvas.width/2, canvas.height/2, radius, 0, 2*Math.PI);
    ctx.closePath();
    ctx.fillStyle = '#00000';
    ctx.fill();

// create random points
    ctx.fillStyle = '#ffffff';

while(count) {
    // randomise x:y

    ctx.fillRect(x + canvas.width/2, y + canvas.height/2, 2, 2);
    count--;
}
Run Code Online (Sandbox Code Playgroud)

我如何生成随机(x,y)坐标来绘制圆内的随机点?

我现在的小提琴:http://jsfiddle.net/e8jqdxp3/

javascript random geometry canvas

6
推荐指数
1
解决办法
3416
查看次数

画布层……什么是性能效果?

我很好奇在 html 中的 canvas' 之上使用 canvas 是否会影响性能?

我的想法是将任何静止的东西放在一个画布中,然后将任何移动的东西放在另一个画布中……有效地减少发生的重绘次数。

由于我不需要重新绘制任何静止的东西,明智的做法是不要一直清除它并重新绘制它。所以我想在画布上放一个画布……但不确定这是否会导致某种性能下降?

有没有人对此做过基准测试?

html javascript canvas

5
推荐指数
1
解决办法
1224
查看次数

Javascript绘制画布内存泄漏

这个脚本在所有浏览器中无休止地占用内存。我不明白为什么!

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var particles = [], amount = 5;
var x = 100; var y = 100;
var W, H;
var p, gradient;  

//dimensions
if(window.innerHeight){
    W = window.innerWidth, H = window.innerHeight;
}else{
    W = document.documentElement.clientWidth, H = document.documentElement.clientHeight;
}
canvas.width = W, canvas.height = H;


//array voor de meerdere particles
for(var i=0;i<amount;i++){
    particles.push(new create_particle());
}

function create_particle(){
    //random positie op canvas
    this.x = Math.random()*W;
    this.y = Math.random()*H;

    //random snelheid
    this.vx = Math.random()*20-10;
    this.vy …
Run Code Online (Sandbox Code Playgroud)

javascript memory memory-leaks canvas draw

5
推荐指数
1
解决办法
3125
查看次数

检查图像的像素数据

让我们说:

Img = new Image();
img.src = 'test.png';
Run Code Online (Sandbox Code Playgroud)

有没有办法检查该图像中的像素说x= 10; y = 16;并返回其RGBA数据?或者您是否必须创建像素阵列以查询特定像素...我不确定在您设置图像src时是否创建了像素阵列?

javascript

5
推荐指数
1
解决办法
906
查看次数

在Javascript中计算小于1毫秒的FPS

是否可以测量所有浏览器支持的时间间隔小于1毫秒,我只知道Chrome中的一种方式.

chrome方法: window.performance.now()

目前我在毫秒时间空间内进行FPS测量,但如果经过不到1ms则得到无穷大,因为这两个数字四舍五入到最接近的毫秒,所以它们是相同的值.

有没有人知道跨浏览器函数计算javascript中不到1毫秒的时间间隔?

javascript

5
推荐指数
1
解决办法
1194
查看次数

Javascript滚动功能

我使用带有鼠标滚轮的事件监听器在javascript中创建了我自己的滚动功能,问题是,该功能允许用户一直向下滚动到远处,而不是一旦它们到达滚动div的底部就停止.

这就是我所拥有的:http: //jsfiddle.net/RjEr7/7/

有问题的功能:

function do_it(e){
    var jump = 50;
    var parentHeight = parseInt(this.parentNode.offsetHeight)-50;
    var childHeight = parseInt(this.offsetHeight);
    var i = parseInt(this.style.marginTop, 10) || 0;
    var wheel = e.wheelDeltaY;
    var childHeightNew = childHeight + i;

    if(wheel == -120){
        if(childHeightNew > parentHeight){                                                  
                i -= jump;  
        }
    }else if(wheel == 120){
        if( (childHeightNew < childHeight) && i < 0){
                i += jump;
            if(i>0){
                    i=0;
            }
        }
    }
this.style.marginTop = i + 'px';
}
Run Code Online (Sandbox Code Playgroud)

在JSfiddle中,您会看到红色框向上滚动太远.不知道怎么解决它.

请帮忙.

javascript

5
推荐指数
1
解决办法
1836
查看次数

如何在javascript中处理多个进度条

我有一些进度条,每个进度条都绑定到div,使用'setTimeouts'进行更新.

它如何运行的一个例子是这样的:

myDiv._timer = setTimeout(function () {
            func_name(data)
        }, 1);
Run Code Online (Sandbox Code Playgroud)

编辑:根据要求我的一个进度条的工作示例:http://jsfiddle.net/H4SCr/

然而问题是,我有多个带有进度条的div,它们有自己的数据用于计算进展.这意味着在运行中我说有5个不同的超时运行.

我不是javascript的专家,但肯定有一种方法可以将这种方法结构化为所有进度条只有一次,或者我目前的方法是最好的方法吗?

注意:我不使用jQuery.我更喜欢用香草javascript来学习!

javascript

5
推荐指数
1
解决办法
962
查看次数

绝对位置不在父级内

我的 CSS 有关于 div 位置的问题。

我有一个父 div 设置为position:relative和一个子 div 设置为position:absolute

但由于某种原因,子 div 显示在父 div 的边界下方和外部...

这是我的 CSS:

.big{
    position:relative;
    width:40%;
    border:1px solid black;
    display:inline-block;
}

.small{
    position:absolute;
    width:75px;
    height:75px;
    border:1px solid green;
}
Run Code Online (Sandbox Code Playgroud)

HTML:

<div class="big">        
    <p align="center">Test</p>
    <div class="small"></div>        
</div>
<div class="big">
    <p align="center">Test</p>
    <div class="small"></div>    
</div>
Run Code Online (Sandbox Code Playgroud)

我提供了一个 JSFiddle 来向你展示它的实际效果:

http://jsfiddle.net/j6VLc/1/

我如何修复它以使子 div 在使用时位于父 div 内position:absolute?

html css

5
推荐指数
1
解决办法
1万
查看次数

可以在严格模式下仅在顶级声明函数

使用严格模式的FireFox时出现此错误.但我不确定这意味着什么.我认为这意味着函数必须在调用之前声明,但错误仍然存​​在.

SyntaxError:在严格模式代码中,函数可以仅在顶层声明,也可以在另一个函数中立即声明

这是我的代码片段,它导致错误:

var process = new function(){

  var self = this;

  self.test = function(value,callback){
    var startTime = Date.now();

     function update(){     //<--- error is here
                value++;
                startTime        = Date.now();

                if(value < 100){ 
                    setTimeout(update, 0);
                }
                callback(value);
    }       
    update();
  }

};
Run Code Online (Sandbox Code Playgroud)

所以我想知道如何用严格的方法正确编写这段代码?顶级是什么意思?这是指全局定义而不是函数中的本地定义?

另外,我知道use strict为什么Chrome中不会出现此问题?

javascript

5
推荐指数
1
解决办法
8919
查看次数

标签 统计

javascript ×9

canvas ×3

html ×2

css ×1

draw ×1

geometry ×1

memory ×1

memory-leaks ×1

random ×1