1

私はこのjavascriptファイルを持っています($( "#paper2")はdivです)

var lines=0;

$(document).ready(function() {        
    $("#paper2").svg({
        onLoad: function() {
            svg2 = $("#paper2").svg('get');
            root2= svg2.root();

            $("#paper2").mousedown(function(ev) {
                lines++;
                var polyline = svg2.polyline([[ev.pageX-1-this.offsetLeft , ev.pageY-this.offsetTop-1], [ev.pageX+1-this.offsetLeft , ev.pageY-this.offsetTop+1]],
                    {fill: 'none', stroke: 'black', strokeWidth: 3,
                    id: 'polyline'+lines})

                $("#paper2").mousemove(function(ev) {
                    var polyline= $('#polyline' + lines);
                    polyline.attr("points", polyline.attr("points")+ ' ' + (ev.pageX-this.offsetLeft)+','+(ev.pageY-this.offsetTop));
                });

                $("#paper2").mouseup(function(ev) {
                    var div= $("#paper2");
                    div.unbind('mousemove');
                    div.unbind('mouseup');
                })
            });             
        },
        settings: {}
    });

});

基本的に、divの上でマウスキーを押したままにすると、マウスに続くポリラインが描画され始め、基本的な描画が可能になります。OperaとChromeでは正常に動作しますが、Firefoxでは、最初に描画したポリラインで正常に動作し、2回目(マウスを離してからもう一度押す)では、画像をドラッグしているように動作します(すべてのSVGのもの)それは私のdiv内にあり、私のマウスに従います)、mouse-upイベントは呼び出されません。したがって、この2回目のマウスボタンを離すと、ポリラインの描画が正常に開始されますが、クリックは下がっていません。もう一度クリックすると、マウスアップイベントが発生し、正常に動作し始めます。これは、2回目に線を引こうとしたときにのみ発生し、1回目、3回目、およびそれ以降はすべて正常に機能します。

私が何か間違ったことをしているのか、それともこれが実際にFirefoxのバグであるのか、誰かが回避策を知っているのであれば、誰もが知っていますか?

4

1 に答える 1

1

あなたは何か間違ったことをしています。各イベントハンドラーでev.preventDefault()を呼び出す必要があります。

于 2012-07-23T13:26:11.790 に答える