jQuery UI可選 - mouseup沒有觸發

我有一個項目列表，點擊拖動並選擇我已經使用jQuery UI可選。選擇部分工作順利，但我已將「mousedown」和「mouseup」事件委託給項目列表，但當我包含jquery-ui.css文件時，不會觸發「mouseup」事件。jQuery UI可選 - mouseup沒有觸發

HTML

<div id="favoritelist"> 
    <span>This is favorite list</span> 
    <ol id="selectable"> 
     <li class="ui-widget-content">Item 1</li> 
     <li class="ui-widget-content">Item 2</li> 
     <li class="ui-widget-content">Item 3</li> 
     <li class="ui-widget-content">Item 4</li> 
     <li class="ui-widget-content">Item 5</li> 
     <li class="ui-widget-content">Item 6</li> 
     <li class="ui-widget-content">Item 7</li> 
    </ol> 
</div>

$('#favoritelist').on("mouseup", function(){ 
    console.log('in favoritelist mouseup'); 
}); 

$('#favoritelist').on("mousedown", function(){ 
    console.log('in favoritelist mousedown'); 
}); 

$("#selectable").selectable();

我已經包含了以下文件：

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> 
<script src="//code.jquery.com/jquery-1.10.2.js"></script> 
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

當我包括「則不會觸發MouseUp事件jquery- ui.css「fil即但是當我刪除「jquery-ui.css」文件時，mouseup事件被正確觸發，選擇也按預期工作。

我很困惑爲什麼mouseup事件沒有傳播時，我包括jquery-ui.css文件。

JSBIN LINK

來源

2015-12-06 Jeevi

這個問題/行爲已討論都在這裏上SO和jQuery的forums & issue tracker - 它歸結爲一個事實，那就是被注入，以顯示視覺上的「套索幫手DIV 「用戶會看到是否對可選項目進行點擊和拖動。該套索DIV位於可選元素的鼠標&之間，並因此干擾mouseup事件。

引用的所有環節提出了兩種選擇：

使用可選distanceinitialization parameter的可選部件，或
使用以下CSS覆蓋：.ui-selectable-helper{pointer-events:none}

我覺得後者是更可靠，雖然前者是技術上的首選路線。

來源

2015-12-08 15:30:30 Stevangelista

jQuery UI可選 - mouseup沒有觸發

回答

相關問題