Question

我正在使用mouseenter事件显示列表中项目的相关信息（信息是通过生成路径获得的）：

$(document).on("mouseenter","#div_example li", function(){

 $("#div_info").load(Routing.generate('show_info', {id:$(this).attr("id")}), function(){
 });

});

此外，我正在使用可排序的jquery-ui来将项目从一个列表拖动到另一个列表：

$( ".sortable" ).sortable({connectWith: ".sortable",

placeholder: "ui-state-highligh",
start: function(event, ui){
 ui.item.css("cursor","none");
 ....
},
stop: function(event, ui){ 
 ui.item.css("cursor","pointer");
 ...
},
over: function(event, ui){

  ...
},
out: function(event, ui){

},
receive: function(event, ui) {

}
}).disableSelection();

我需要在使用sortable时显示该信息，但当我浏览另一个列表时，mouseenter会修改该信息。

我使用下面的代码在另一个div的帮助下解决它，在使用sortable时显示信息，但我想知道如何避免它而不必像这样做软糖。

$( ".sortable" ).sortable({connectWith: ".sortable",

placeholder: "ui-state-highligh",
start: function(event, ui){
 ui.item.css("cursor","none");

  $("#div_info_drag").css("style","display:block;");
  $("#div_info").css("style","display:none;");

  $("#div_info_drag").load(Routing.generate('show_info',{id:ui.item.attr("id")}), function(){
  });

},
stop: function(event, ui){ 
 ui.item.css("cursor","pointer");

  $("#div_info").empty();
  $("#div_info_drag").empty();
  $("#div_info_drag").css("style","display:none;");
  $("#div_info").css("style","display:block;");
},
over: function(event, ui){

  ...
},
out: function(event, ui){

},
receive: function(event, ui) {

}
}).disableSelection();

如何在使用sortable时阻止mouseenter运行？

Answer 1

尝试：

$("#div_info").unbind("mouseenter");
$("#div_info").unbind("mouseleave");

当我使用可排序的jquery-ui时，如何避免mouseenter事件

1 个答案: