3

私は単純な問題だと思っていましたが、約 1 週間解決策を探した後、その背後にある理由を見つけることができないようです。

基本的に、マウスがクリックされるたびに以下の関数を呼び出しており、Chrome では正常に動作しますが、Firefox ではalert("This is not called")呼び出されません。

問題が 2 行のコードにあることはわかっています。

x = event.pageX - canvas.offsetLeft;
y = event.pageY - canvas.offsetTop;

しかし、何が悪いのかを見つけることができないようです。Mozilla のサイトによると、これevent.pageXは正当な呼び出しコマンドであり、canvas.offsetLeft.

しかし、関数はまだ呼び出されていません。グローバルではなく関数内で変数を定義しようとしましたが、うまくいきませんでした.jQueryイベントハンドラーを含む他のいくつかの代替手段を試しましたが、可能な限りjQueryから離れたいと思います.主に、パッチを当てるだけでなく、ここで何が起こっているのかを理解したいからです。

どんな助けでも大歓迎です。

また、問題のサイトはhttp://cabbibo.comです。

編集：それがまったく役立つ場合、Firefoxの残りのJavascriptの実行は非常に遅いため、コードの別の場所で問題が発生している可能性があると思います。たとえば、サイドナビゲーションが開いているとき、アニメーションが呼び出されると、必要以上に時間がかかります。

function q(event){  
    if(hasBeenCalled==0){       
        event = event || window.event;
        var canvas = document.getElementById('canvas');

        x = event.pageX - canvas.offsetLeft;
        y = event.pageY - canvas.offsetTop;

        alert("This Is Not Called");

        Changer2();
        stopDraw();
        moveToCenter();

        t = setInterval(rotateDrawRec, 1);
    }else{}
}
4

2 に答える 2

2

これを行う代わりに：

<canvas id="canvas" onclick="q()"  width="1000" height="900"></canvas>

function q(event){  
    if(hasBeenCalled==0){       
        event = event || window.event;
        var canvas = document.getElementById('canvas');

        x = event.pageX - canvas.offsetLeft;
        y = event.pageY - canvas.offsetTop;

        alert("This Is Not Called");

        Changer2();
        stopDraw();
        moveToCenter();

        t = setInterval(rotateDrawRec, 1);
    }else{}
}

これを試して：

<canvas id="canvas" width="1000" height="900"></canvas>

var canvasElem = document.getElementById('canvas');
canvasElem.addEventListener("click", q, false);

function q(event){  
    if(hasBeenCalled==0){       
        event = event || window.event;

        x = event.pageX - this.offsetLeft;
        y = event.pageY - this.offsetTop;

        alert("This Is Not Called");

        Changer2();
        stopDraw();
        moveToCenter();

        t = setInterval(rotateDrawRec, 1);
    }else{}
}

JSFiddle:
http://jsfiddle.net/5Xs2S/3/

于 2012-06-10T20:51:57.243 に答える
1

あなたのサイト (http://cabbibo.com/) は、61 行目で「canvas3 is null」エラーをスローします。

var ctx3 = canvas3.getContext("2d");

このエラーはスクリプト全体の実行を停止するため、当然のことながら、アラートq()も呼び出されません。

于 2012-06-10T20:51:25.330 に答える