-2

这现在工作正常，如何在没有数组的情况下完成（仅使用侦听器），我需要将代码更改为没有数组但具有相同的功能。

这是Javascript代码。它是一个简单的绘图应用程序。

$(document).ready(function(){   
var x;
var y;
var canv = $("#myCanvas")[0];
var ctx = canv.getContext("2d");

var lines = new Array();

$("#myCanvas").click(function(event)
{
    x = event.pageX - $("#myCanvas").offset().left;
    y = event.pageY - $("#myCanvas").offset().top;

    ctx.fillStyle = "#" + $("#barvaPolnila").val();
    ctx.strokeStyle = "#" + $("#barvaCrte").val();
    ctx.lineWidth = $("#sirina").val();

    fill = $("input[name=polni]").is(":checked");
    width = $("#dolzina").val();

    shape = $("input[@name='lik']:checked").val();

    if (shape == 'krog') {
        ctx.beginPath();
        ctx.arc(x, y, width, 0*Math.PI, 2*Math.PI);
        if(fill)
            ctx.fill();
        else
            ctx.stroke();
    } else if(shape == "kvadrat") {
        ctx.rect(x, y, width, width);
        if(fill)
            ctx.fill();
        else
            ctx.stroke();
    } else {
        if(lines[0] !== undefined) {
            ctx.moveTo(lines[lines.length-1][0], lines[lines.length-1][1]);
            ctx.lineTo(x, y);
            ctx.stroke();
        } else 
            ctx.beginPath();

        lines.push([x, y]);
    }
});


$("#skrij").click(function() {
    gumb = $(this);
    nadzornaPlosca = $("#nadzornaPlosca");
    nadzornaPlosca.slideToggle(400, function() {
        if($(this).is(":visible")) {
            gumb.attr("value", "-");
        } else {
            gumb.attr("value", "+");
        }
    });
});

$("#zakljuci").click(function() {
    if(lines[0] !== undefined) {
        ctx.moveTo(lines[lines.length-1][0], lines[lines.length-1][1]);
        ctx.lineTo(lines[0][0], lines[0][1]);
        ctx.stroke();

        if($("input[name=polni]").is(":checked")) {
            ctx.beginPath();
            for(i = 0; i < lines.length; i++) {
                ctx.lineTo(lines[i][0], lines[i][1]);
            }
            ctx.closePath();
            ctx.fill();
        }
    }
    lines = new Array();
});

$("input[name=lik]").change(function() {
    lines = new Array();
});

$("#brisi").click(function() {
    ctx.clearRect(0, 0, canv.width, canv.height);
})
});
4

2 回答 2

1

如果要将函数绑定到这些click事件，则不要使用if()语句。更新代码以使用click()jQuery 中函数的回调函数，如下所示：

$("#pokazi").click(function(function() {
    $("#nadzornaPlosca").slideToggle("slow");
});

$("#brisi").click(function() {
    ctx.clearRect(0,0, 500, 500);
});
于 2013-04-06T11:19:18.057 回答
1

最后两位有点坏了，你正在附加事件处理程序，但if在定义之前包括一个并关闭函数，这样做：

$("#pokazi").click(function () {
    $("#nadzornaPlosca").slideToggle("slow");
});

$("#brisi").click(function () {
    ctx.clearRect(0,0, 500, 500);
});
于 2013-04-06T11:20:02.950 回答