如何重新啟動事件mousemove jquery？

Question

我必須通過單擊來移動div，再次單擊我必須將div停在該位置。 現在的問題是：當我想再次移動div時，不激活mousemove事件...我該如何解決？

$('.move_div').live('click', function() {                    
    $('html').on('mousemove', function(e) {
       var x = e.pageX - this.offsetLeft;
       var y = e.pageY - this.offsetTop;
       $('div').css({'top': y, 'left': x});
    });
    $("html").live('click', function() {
       $('html').off('mousemove');
    });
});

Answer 1

var ele = '.move_adv';
var moveBool = false;

$(function () {
    $('html').on('mousemove', function (e) {
        console.log($(this).width());
        if (moveBool == true) {
            var x = e.pageX - $(ele).width()/2;
            var y = e.pageY - $(ele).height()/2;
            $(ele).css({
                'top': y,
                    'left': x
            });
        }
    });
});

$(ele).live('click', function () {
    moveBool = !moveBool;
});

http://jsfiddle.net/6y24s/2/

主要邏輯是將div的“可移動性”狀態存儲在布爾值中。

您還希望進一步完善代碼。

Answer 2

在這里擺弄 ，如果您想保留代碼，則只需添加

event.stopPropagation();

Answer 3

當您單擊div時，mousemove處理程序將添加到div中。 然后，將事件處理程序添加到文檔中，以刪除所有mousemove事件處理程序。
然后，您移動鼠標，然后單擊div，然后單擊並刪除mousemove處理程序。 您再次單擊div，添加了mousemove事件處理程序，不過文檔中的click事件處理程序將刪除mousemove處理程序。
因此，無論您在前兩次單擊后單擊還是單擊，mousemove處理程序都會同時創建和銷毀。

同時使用.on（）而不是.live（）
.live（）在JQuery 1.7中已棄用