0

私はJavaScriptを初めて使用します..私は基本的に、ユーザーが目的の形状ボタンをクリックした後にキャンバス上に形状を描画できるときに、このさまざまな形状描画(キャンバス上)プログラムを作成しています...そのコードは次のようになります:

var rectangle = document.getElementById('rec');
rectangle.addEventListener('click', function (e) {
    x2 =  y2 = 0;
    globalOption = 'rec';
    var rec = new shape();
    e.preventDefault();
}, false)

その後、init関数で..マウスダウンイベントで：

else if(globalOption == 'rec')
    {           
        e.target.style.cursor = 'crosshair';
        rec.name = 'rec';
        started = 'true';
        x2 = y2 = 0;
        x = e.pageX - canvas.offsetLeft;
        y = e.pageY - canvas.offsetTop;
        rec.x = x;
        rec.y = y;
        //context.beginPath();
    }

このシェイプに関するすべての情報を、先ほど addEventListener コード「var rec = new shape();」で作成したシェイプ オブジェクトに格納しています。マウスアップイベントでこのオブジェクトを配列にプッシュしています。問題は、配列の長さが正しいにもかかわらず、最後にプッシュされたオブジェクトの情報のみを保存することです..しかし、含まれるすべてのオブジェクトには、最後にプッシュされたオブジェクトの同じ情報が1つあります! それはなぜですか?? 「var rec = new shape();」を配置してみました 違う場所に並んでもダメ！

4

2 に答える 2

4

新しいオブジェクトを作成し、データを rec からそれにコピーする必要があります。そして、新しいオブジェクトを配列にプッシュします。それ以外の場合は、「rec」変数への参照のみが保持されるため、常に最後の要素を取得します。

于 2013-10-28T18:07:35.900 に答える
0

私は参照によって各オブジェクトをコピーしていました..必要なのは、新しいオブジェクトを作成し、各値を1つずつコピーしてから、その新しいオブジェクトをプッシュすることでした!

于 2013-10-29T14:16:06.427 に答える