Question

我刚刚开始了一个小小的项目来学习更多Javascript，特别是画布。我想创建一个简单的绘图应用程序，但我现在卡住了。

目前我已经设法让绘图工作（需要微调但我刚开始）所以现在我想在我的代码中放置一个mousedown和mouseup事件。

所以这就是我所做的：

var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');

var radius = 10;
var drag = false;

canvas.width = window.innerWidth;
canvas.height = window.innerHeight; //grootte van de canvas

var putPoint = function(e){
    if(drag = true){
        context.beginPath();
        context.arc(e.offsetX, e.offsetY, radius, 0, Math.PI*2);
        context.fill();
        console.log(drag);
    }
}

var engage = function(){
    drag = true;
}

var disengage = function(){
    drag = false;
}

canvas.addEventListener('mousedown', engage);
canvas.addEventListener('mouseup', disengage);
canvas.addEventListener('mousemove', putPoint);

我把变量“拖”进去检查条件是真还是假。默认情况下我把它弄错了。当触发鼠标按下事件时，函数参与必须完成其工作并使变量drag = true。

当变量为true时，它应激活putPoint函数以在其上绘制点。

但问题是。当我启动代码默认情况下它是真的而不是假的。我似乎无法在这里找到问题，因为对我而言，它看起来就像它应该是一样。

希望你们能帮助我，看看我在这里做错了什么。

这是一个小提琴： http://jsfiddle.net/tbmluijten/bTV9v/

谢谢！

Answer 1

您不仅要进行测试，还需要进行测试。

更改

if(drag = true){

到

if(drag == true){

或更好

if (drag) {

在参考上一个示例时，here是一篇关于truthy/falsey值概念的精彩文章。

javascript值是真的，而它应该是假的？

1 个答案: