Javascript"；网络错误：500内部服务器错误“；继续。。相比之下

我有一个关于javascript的问题，下面的函数将在用户单击鼠标、按住并移动鼠标时跟踪鼠标移动。我有另一个函数，它将在特定的间隔检查中或当用户基于ghostCanvasRedraw==true标志更改画布上的某些内容时重新绘制画布。但是，当我尝试检查当前鼠标指针是否在我绘制的矩形内时，出现了以下错误：

网络错误：500内部服务器错误

触发重画的功能如下所示。我预计if的比较结果为。。内环是罪魁祸首。请帮忙，谢谢你的建议。谢谢

    function addMouseMoveEvent(canvas) {
        EventUtil.addHandler(canvas, 'mousemove', function(event) {
            event = EventUtil.getEvent(event);
            var rect = canvas.getBoundingClientRect();
            mouseX = event.clientX - rect.left;
            mouseY = event.clientY - rect.top;

            if (!isDragging) {
                console.log('Mouse move coordinate on Pdf document: ' + mouseX + ', ' + mouseY);
            }
            else if (isDragging) {
                console.log('Mouse drag coordinate on Pdf document: ' + mouseX + ', ' + mouseY);

                for (var i in boxes) {

                    if (mouseX > boxes[i].x && mouseX < boxes[i].x + boxes[i].w && mouseY > boxes[i].y && mouseY < boxes[i].y + boxes[i].h) {
                        boxes[i].x = mouseX - boxes[i].w / 2;
                        boxes[i].y = mouseY - boxes[i].h / 2;
                        ghostCanvasRedraw = true;

                        console.log('Box in dragging [' + boxes[i].x + ', ' + boxes[i].y + ', ' + boxes[i].w + ', ' + boxes[i].h + ']');
                    }
                }
            }
        });
    } 

---

Box对象在哪里？如果我删除If语句，代码运行正常。。。就在我添加if语句时，发生了指定的错误。为什么要使用prototype？您正在写入对象，

Box

从中获取其属性

Function.prototype.someProperty=

是您通常使用的方法。我只需要在你的

框

构造函数中执行

this.drawRectangle=function（ctx）{}

。

    function Box() {
        this.x = 0;
        this.y = 0;
        this.w = 1; 
        this.h = 1;
        this.lineWidth = 2;
        this.lineColor = 'blue';
        this.fill = '#444444';  
    }

    Box.prototype = {
            // Draw rectangle
            drawRectangle : function(ctx) {
                console.log('Box in drawing [' + this.x + ', ' + this.y + ', ' + this.w + ', ' + this.h + ']');

                ctx.beginPath();
                ctx.strokeStyle = this.lineColor;
                ctx.lineWidth = this.lineWidth;
                ctx.fillStyle = this.fill;
                // For box transparency
                ctx.globalAlpha = 0.2;
                // Draw filled rectangle
                ctx.fillRect(this.x, this.y, this.w, this.h);
                // Draw stroke for rectangle
                ctx.strokeRect(this.x, this.y, this.w, this.h);

                // Draw selection handles
                var half = 3;

                // 0  1  2
                // 3     4
                // 5  6  7
                selectionHandles = [];

                // top left, middle, right
                selectionHandles.push({x : this.x - half, y : this.y - half});
                selectionHandles.push({x : this.x + this.w / 2 - half, y : this.y - half});
                selectionHandles.push({x : this.x + this.w - half, y : this.y - half});

                //middle left
                selectionHandles.push({x : this.x - half, y : this.y + this.h / 2 - half});

                //middle right
                selectionHandles.push({x : this.x + this.w - half, y : this.y + this.h / 2 - half});

                //bottom left, middle, right
                selectionHandles.push({x : this.x + this.w / 2 - half, y : this.y + this.h - half});
                selectionHandles.push({x : this.x - half, y : this.y + this.h - half});
                selectionHandles.push({x : this.x + this.w - half, y : this.y + this.h - half});

                for (var i in selectionHandles) {
                    ctx.fillRect(selectionHandles[i].x, selectionHandles[i].y, 6, 6);
                    i += 1;
            }
        }
    }