jQuery 事件在 mouseup 时停止

Question

我正在尝试制作一个非常简单的应用程序，当鼠标按钮按下时，用户可以使用选定的颜色绘制到表格中，当鼠标松开时事件停止。

绘图效果很好，唯一的问题是释放鼠标时事件不会停止。 我已经尝试过很多方法，但显然我做错了。还尝试了绑定(bind)和取消绑定(bind)事件，但也不起作用。

您可以在此处查看代码的一个版本: http://jsfiddle.net/mFzkG/8/

非常感谢任何帮助!

Answer 1

您所要做的就是从表格单元格绑定(bind)和取消绑定(bind)事件。

 var currentColor;
    $('.colors').click(function() {
        $(this).fadeTo("fast", 0.40);
        currentColor = $(this).css("background-color");
        $('.colors').not(this).fadeTo("fast", 1);
    });


    $('table').mousedown(
    function() {
        $('td').bind('hover', function(){
            $(this).css(
            "background-color", currentColor
            );            
        });
        }).mouseup(function(){
            $('table td').unbind('hover');
            $('table').css(function(){
                return false;
        });
        });


    $("#reset").click(function() {
        $("td").css("background-color", "white")
    }
    );

这里正在工作 jsFiddle http://jsfiddle.net/mFzkG/12/