从树视图拖动项时出现jquery问题

我有一个treeview菜单，用户可以在其中拖放内容到列表上（比如带有标签的gmail）。每样东西都能工作99%。当鼠标悬停在树状视图中的某个项目上时，背景颜色发生了变化（这对我来说没关系）。当鼠标离开项目时，背景将恢复为白色。问题是当（jquery）拖动开始时，项目背景会发生更改，并且不会像正常情况下那样恢复为白色（刷新问题？）

我如何继续（拖动开始时？）来安排这个小问题

我已经试过了：

$（this.children（）.css（'background-color'，'#ffffffff'）

但这是不可接受的，因为css已被明确更改（不再有悬停/离开差异）。我需要一些东西，比如刷新一下这个项目。我看到，如果我将鼠标悬停在项目上（在拖放操作之后），背景会恢复为白色（应该是这样）

截图1

在第一个屏幕截图中，我们看到用户将鼠标放在树视图中的一个项目上，因此背景颜色为浅蓝色。这次没有拖放，所以对我来说没问题

截图2

在屏幕截图2中，用户拖动一个项目，我们看到辅助对象被拖动。问题是树视图中原来的itm仍然是蓝色的！烦人的

如果拖放被取消或完成，并且用户将鼠标移到这个蓝色项目上，它将变回白色背景，但为时已晚

我编辑我的问题以回答福图因的问题

@Phortuin:mouseenter和mouseleave事件都是通过css管理的，如下所示：

.treeview li{ 
  margin-top: 2px;
  margin-bottom: 2px;
  padding-left: 20px; 
  list-style: none;  
}

.treeview li a:hover
{    
  background-color: #f3f7fd;
  border-color: #bbd8fb;
  border-width: 1px;
  border-style: solid;  
}

如果我不知道该怎么做

---

另一个解决方案是仅使用jquery管理mouseover/mouseleave事件，正如您向我展示的，但可能有一个更简单的解决方案（并保留我的css）？

原因可能是mouseleave事件从未触发过（hover是mouseEnter和mouseleave的包装器）。类似的结构如下：

<a href="http://stackoverflow.com" target="_blank"><img src="/images/stackoverflow.gif" alt="" /></a>

现在，当我将鼠标悬停在图像上并单击链接时，该站点将在一个新选项卡或窗口中打开，当我切换回原始站点时，该图像仍将具有stackoverflow-hover.gif图像，因为mouseLeave事件从未触发

你需要做的是确保你想要的行为确实被触发。您可以这样做：

$("span.item").mouseenter(function(){
    $(this).addClass("active");
});
$("span.item").bind("mouseleave blur mouseout", function(){
    $(this).removeClass("active");
});

bind方法将允许您将多个事件绑定到元素，所有这些事件都会导致相同的行为。用几个事件来尝试一下，看看效果如何。此外，您还可以通过jQuery了解如何触发事件：-您可以在drag方法的回调中触发自定义事件：

$("span.item").drag(function(){
    // do some dragging
}, function() {
    this.trigger("myEvents:draggingIsFinished");
});

$("span.item").bind("myEvents:draggingIsFinished", function(){
   // do stuff after dragging
});

---

我找到了如下解决方案（保持css不变）：

---

你能发一些代码吗？最好有一个关于@Khez的工作示例：我添加了两个屏幕截图。希望能有帮助。谢谢

$("span.item").drag(function(){
    // do some dragging
}, function() {
    this.trigger("myEvents:draggingIsFinished");
});

$("span.item").bind("myEvents:draggingIsFinished", function(){
   // do stuff after dragging
});

    $('#treemenu1 ul li a').hover( function(){ 
        $(this).css('background-color', '#f3f7fd');
        $(this).css('border-color', '#bbd8fb');
    });

    $('#treemenu1 ul li a').mouseleave( function(){ 
        $(this).css('background-color', 'transparent');
        $(this).css('border-color', 'transparent');
    });