通过单击和拖动div使用mousemove，mousedown和mouseup

Question

我似乎无法正常工作，但是我想要做的是能够将某些东西连接到鼠标上，然后当我将鼠标单击取消绑定时将其取消绑定，然后将其重新绑定以移动宽度和高度，而不是上下移动。 尝试如下：

$(document).mousemove(function(mouseEvent) {
    creationTagBool = true;
    n.show();
    n.css("left", mouseEvent.pageX);
    n.css("top", mouseEvent.pageY);
}).mousedown(function(mouseEvent) {
    if (creationTagBool) {
        $(this).unbind("mousemove");
        creationTagBool = false;
        //draggCon();
        n.css("width", mouseEvent.pageX - n.css("left"));
        n.css("height", mouseEvent.pageY - n.css("top"));
    }

}).mouseup(function(mouseEvent) {
    $(this).unbind("mousedown");
    draggCon();
});​

我实际上在想它应该执行以下操作：mousemove，mousedown解除绑定然后重新绑定mousemove，on mouseup再次解除绑定mousemove。

当我键入此内容时，我认为这可能有效，因此我必须对其进行快速测试。 我的想法如下：

$(document).mousemove(function(mouseEvent) {
    creationTagBool = true;
    n.show();
    n.css("left", mouseEvent.pageX);
    n.css("top", mouseEvent.pageY);
}).mousedown(function(mouseEvent) {
    if (creationTagBool) {
        $(this).unbind("mousemove");
        creationTagBool = false;
        //draggCon();
        //n.css("width", mouseEvent.pageX - n.css("left"));
        //
        $(this).mousemove(function() {
            n.css("width", mouseEvent.pageX - n.css("left"));
            n.css("height", mouseEvent.pageY - n.css("top"));
        }).mouseup(function() {
            $(this).unbind("mousemove");
            draggCon();
        });
    }
});​

Answer 1

错误是宽度的高度和宽度，因此在运行时，您需要拥有。 mouseEvent.pageX + n.position（）。left而不是n.css（“ left”）。

当我开始工作时，它似乎很好，尽管速度稍慢。 暂时没有单击和拖动事件，而是将其选中为2次单击。