Контекст Mouseout и mousedown

Question

Я хочу в table, если пользователь наводил мышь на каждую строку, указанную рядом с анимированным цветом, и когда мышь выходила, тогда цвет строки возвращался к ее умолчанию. но если пользователь щелкнет правой кнопкой мыши по строке, эта строка будет красной, пока не нажмете контекстное меню.

Я попробовал этот код, но когда пользователь щелкает правой кнопкой мыши и хотите выбрать пункт меню, красный строки возврат к умолчанию, но я хочу грести быть красным до щелчка (выберите):

$(function() { 
$('.users').contextMenu({ 
    selector: 'tr', 
    callback: function (key, options) { 
     if (key == 'delete') { 
      if (confirm(" Are you sure?")) { 
       $.post("../Actions/Delete.ashx", { type: "user", id: $(this).attr('id') }); 
       $(this).animate({ backgroundColor: '#FF80FF' }, 1000); 
      } 
     } 

    }, 
    items: { 
     "edit": { name: "edit" }, 
     "delete": { name: "delete" } 
    } 
}); 
$('tr').mouseover(function() { 
    $('td', this).stop(true, true).animate 
    ({ backgroundColor: "#80FF00" }, 300); 
}); 

$('tr').mouseout(function() { 
    $('td', this).stop(true, true).animate 
    ({ backgroundColor: "white" }, 300); 
}); 
$('tr').mousedown(function (event) { 
    if (event.which==3) { 
     $('td', this).animate 
    ({ backgroundColor: "red" }, 300); 
    } 
}); 
}); 

Answer 1

Убедитесь, что право щелкнул с clicked flag:

$(function() { 
var clicked=false; 
$('.users').contextMenu({ 
    selector: 'tr', 
    callback: function (key, options) { 
     if (key == 'delete') { 
      if (confirm(" Are you sure?")) { 
       $.post("../Actions/Delete.ashx", { type: "user", id: $(this).attr('id') }); 

       $(this).animate({ backgroundColor: '#FF80FF' }, 1000); 
      } 
     clicked=false; 
     } 

    }, 
    items: { 
     "edit": { name: "edit" }, 
     "delete": { name: "delete" } 
    } 
}); 
$('tr').mouseover(function() { 
    $('td', this).stop(true, true).animate 
    ({ backgroundColor: "#80FF00" }, 300); 
}); 

$('tr').mouseout(function() { 
    if(!clicked){ 
    $('td', this).stop(true, true).animate 
    ({ backgroundColor: "white" }, 300); 
} 
}); 
$('tr').mousedown(function (event) { 
    if (event.which==3) { 
     clicked=true; 
     $('td', this).animate 
    ({ backgroundColor: "red" }, 300); 
    } 
}); 
});