【问题标题】:jQuery SVG creating polyline, firefox bug?jQuery SVG 创建折线,firefox 错误?
【发布时间】:2012-07-23 21:26:11
【问题描述】:

我有这个 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 上它在我绘制的第一条折线上运行良好,第二次(释放鼠标然后再次按下它)而不是绘制它就像我在拖动图像(所有 SVG 的东西那是在我的 div 中跟随我的鼠标)并且不会调用 mouse-up 事件。因此,一旦我第二次释放鼠标按钮,它就会开始正常绘制折线,但单击没有按下,如果我再次单击鼠标向上事件,它就会再次开始正常工作。这只发生在我第二次尝试画线时,第一次,第三次和所有其他人都正常工作。

任何人都知道我做错了什么,或者这确实是一个 Firefox 错误,如果是这样,任何人都知道如何解决?

【问题讨论】:

    标签: javascript jquery svg jquery-svg


    【解决方案1】:

    你做错了什么。您需要在每个事件处理程序中调用 ev.preventDefault()。

    【讨论】:

      猜你喜欢
      • 2019-05-24
      • 2019-06-19
      • 2021-04-25
      • 2015-07-16
      • 1970-01-01
      • 2013-10-27
      • 2021-12-23
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多