Question

$(function(){
    var isMouseClicked=false;
    $("#diody td.LED").click(function(){
        if(wybrany_kolor=="red"){
            $(this).css("background-image","url(led_red2.png)")
            .css("transition", "all 0.25s ease-in-out");
            $('.LED').mousedown(function(){
                isMouseClicked = true;  
               });
               $("#app").mouseup(function(){
               isMouseClicked = false;
               });
               $(".LED").mousemove(function(){
                   if(isMouseClicked){
                     $(this).css("background-image","url(led_red2.png)")
                     .css("transition", "all 0.25s ease-in-out");
                   }
               });                  
        }
    });
    $("#diody td.LED").click(function(){
        if(wybrany_kolor=="yellow"){
        $(this).css("background-image","url(led_yellow.png)")
        .css("transition", "all 0.25s ease-in-out");
        $('.LED').mousedown(function(){
            isMouseClicked = true;  
           });
           $("#app").mouseup(function(){
           isMouseClicked = false;
           });
           $(".LED").mousemove(function(){
               if(isMouseClicked){
                 $(this).css("background-image","url(led_yellow.png)")
                 .css("transition", "all 0.25s ease-in-out");
               }
           });
        }
    });

我有这样的感觉。我期待的是：当我点击＆＃34; LED＆＃34;它需要改变kolor，当我点击＆＃34; LED＆＃34;并将鼠标移动到其他人身上＆＃34; LED＆＃34;他们需要将颜色改变为相同的颜色。问题是：它使用一种颜色，但当我将颜色更改为另一种颜色时，例如从红色变为黄色并单击（保持鼠标单击）并移动到其他颜色，它会改变颜色但是红色（应该是黄色）。如果我点击它的改变颜色属性，然后我可以点击并移动鼠标及其工作良好。问题在于第一次换色。

http://jsfiddle.net/9Q8dU/

diody-它的表填充了td.LED（像国际象棋一样）。

编辑：解决

$(function () {
var isMouseClicked=false;
var $led = $('.LED').click(function(){
    if(wybrany_kolor=="red")$(this).css("background-image","url(led_red2.png)");
    else if(wybrany_kolor=="yellow")$(this).css("background-image","url(led_yellow.png)");
    else if(wybrany_kolor==green)$(this).css("background-image","url(led_green.png)");
    })
    .mousedown(function(){ isMouseClicked=true;})
    .mousemove(function () {
    if(isMouseClicked){
        if(wybrany_kolor=="red")$(this).css("background-image","url(led_red2.png)");
        else if(wybrany_kolor=="yellow")$(this).css("background-image","url(led_yellow.png)");
        else if(wybrany_kolor==green)$(this).css("background-image","url(led_green.png)");
    }
});
$(document).mouseup(function () {
    isMouseClicked=false;
})

Answer 1

我认为你可能会误解事件处理程序如何附加。你有：

$("#diody td.LED").click(function(){ ...

在代码中列出两次，每次都有不同的处理程序。这是为每个匹配选择器触发的两个函数。即使这是你想要的，这也是一种非常容易混淆的方式。

接下来，您在这些点击处理程序中有$（＆＃39; .LED＆＃39;）。mouse *处理程序。这将导致附加n点击鼠标事件处理程序的累积效果。

我认为您的设计需要重构。

单击并鼠标移动（更改颜色多个目标）

1 个答案: