Question

mousedown后没有激活mouseup。我不确定为什么。但如果我取消注释该行

$(this).replaceWith("<div class=" + "'" + $canvas.replace(".", " ") + "'" + "></div>");

然后mouseup正常工作。这是一段代码

var onmousemove = function ($canvas) {
       // Painting the map with canvas
        $map_canvas.mousedown(function () {
            var ignoreMouseMove = false;
            mouseDownFired = true;



            $(".map .row div").mousemove(function (e) {

                if (ignoreMouseMove) return;
                //$(this).replaceWith("<div class=" + "'" + $canvas.replace(".", " ") + "'" + "></div>");

                moveCanvas($canvas, e)
            }).mouseup(function () {
                ignoreMouseMove = true;
            });


        });

        var paletteClone = $(document).clone(true);     // bound handler for .palette div

};



var moveCanvas = function ($canvas, e) {
    $(".map ul li." + $canvas).offset({
        left: e.pageX - 30,
        top: e.pageY - 30
    });
};

Answer 1

您正在将mouseup事件绑定到DOM元素，然后在mousemove事件中将其替换 - mouseup事件无法运行，因为该元素不再出现在页面上。

另一种方法是使用mouseup函数使用on的父项绑定.map .row事件 - 这会将事件绑定到父级，因此添加的元素仍会获得行为你期待。

var onmousemove = function ($canvas) {
   // Painting the map with canvas
    $map_canvas.mousedown(function () {
        var ignoreMouseMove = false;
        mouseDownFired = true;

        $(".map .row").on("mousemove", "div", (function (e) {

            if (ignoreMouseMove) return;

            // this is now OK - event bound to parent 
            $(this).replaceWith("<div class=" + "'" + $canvas.replace(".", " ") + "'" + "></div>");

            moveCanvas($canvas, e)
        }).on("mouseup", "div", function () {
            ignoreMouseMove = true;
        });


    });

    var paletteClone = $(document).clone(true);     // bound handler for .palette div

};



var moveCanvas = function ($canvas, e) {
    $(".map ul li." + $canvas).offset({
        left: e.pageX - 30,
        top: e.pageY - 30
    });
};

mousedown后没有触发mouseup

1 个答案: