jQuery UI API - 滑鼠交互（Mouse Interaction）

所屬類別

交互（Interactions） | 實用工具（Utilities）

用法

描述：基本交互層。

依賴：

注釋：與 jQuery.Widget 相似，滑鼠交互的目的不是直接使用。這是一個純粹給其他小部件繼承用的基礎層。該頁面有添加到 jQuery.Widget 的文檔，但是它包含了不能被覆蓋的內部方法。公共的 API 是 _mouseStart()、_mouseDrag()、_mouseStop() 和 _mouseCapture()。

快速導航

選項 方法 事件

選項 類型 描述 默認值
cancel Selector 防止從指定的元素上開始交互。

代碼實例：

初始化帶有指定 cancel 選項的 mouse：

$( ".selector" ).mouse({ cancel: ".title" });
    

在初始化後，獲取或設置 cancel 選項：

// getter
var cancel = $( ".selector" ).mouse( "option", "cancel" );

// setter
$( ".selector" ).mouse( "option", "cancel", ".title" );
    
 "input, textarea, button, select, option"
delay Number 滑鼠按下後直至交互開始的事件，以毫秒計。該選項可用於防止點擊在一個元素上時不必要的交互。

代碼實例：

初始化帶有指定 delay 選項的 mouse：

$( ".selector" ).mouse({ delay: 300 });
    

在初始化後，獲取或設置 delay 選項：

// getter
var delay = $( ".selector" ).mouse( "option", "delay" );

// setter
$( ".selector" ).mouse( "option", "delay", 300 );
    
 0
distance Number 滑鼠按下後交互開始前滑鼠必須移動的距離，以像素計。該選項可用於防止點擊在一個元素上時不必要的交互。

代碼實例：

初始化帶有指定 distance 選項的 mouse：

$( ".selector" ).mouse({ distance: 10 });
    

在初始化後，獲取或設置 distance 選項：

// getter
var distance = $( ".selector" ).mouse( "option", "distance" );

// setter
$( ".selector" ).mouse( "option", "distance", 10 );
    
 1

方法 返回 描述
_mouseCapture() Boolean 決定交互是否應該基於交互的事件目標開始。默認的實現總是返回 true。
  • 該方法不接受任何參數。

代碼實例：

調用 _mouseCapture 方法：

$( ".selector" ).mouse( "_mouseCapture" );
    
_mouseDelayMet() Boolean 決定 delay 選項是否滿足當前交互。
  • 該方法不接受任何參數。

代碼實例：

調用 _mouseDelayMet 方法：

$( ".selector" ).mouse( "_mouseDelayMet" );
    
_mouseDestroy() jQuery (plugin only) 銷毀交互事件處理程式。這必須調用來自擴展的小部件的 _destroy() 方法。
  • 該方法不接受任何參數。

代碼實例：

調用 _mouseDestroy 方法：

$( ".selector" ).mouse( "_mouseDestroy" );
    
_mouseDistanceMet() Boolean 決定 distance 選項是否滿足當前交互。
  • 該方法不接受任何參數。

代碼實例：

調用 _mouseDistanceMet 方法：

$( ".selector" ).mouse( "_mouseDistanceMet" );
    
_mouseDown() jQuery (plugin only) 處理交互的開始。確認與主要的滑鼠按鈕關聯的事件，確保 delay 與 distance 在交互啟動之前得到滿足。當交互已經準備開始，為要處理的擴展小部件調用 _mouseStart 方法。
  • 該方法不接受任何參數。

代碼實例：

調用 _mouseDown 方法：

$( ".selector" ).mouse( "_mouseDown" );
    
_mouseDrag() jQuery (plugin only) 擴展小部件應實現一個 _mouseDrag() 方法，來處理交互的每個移動。該方法將接收與滑鼠移動相關聯的滑鼠事件。
  • 該方法不接受任何參數。

代碼實例：

調用 _mouseDrag 方法：

$( ".selector" ).mouse( "_mouseDrag" );
    
_mouseInit() jQuery (plugin only) 初始化交互事件處理程式。這必須調用來自擴展的小部件的 _create() 方法。
  • 該方法不接受任何參數。

代碼實例：

調用 _mouseInit 方法：

$( ".selector" ).mouse( "_mouseInit" );
    
_mouseMove() jQuery (plugin only) 處理交互的每個移動。為要處理的擴展小部件調用 _mouseDrag 方法。
  • 該方法不接受任何參數。

代碼實例：

調用 _mouseMove 方法：

$( ".selector" ).mouse( "_mouseMove" );
    
_mouseStart() jQuery (plugin only) 擴展小部件應實現一個 _mouseStart() 方法，來處理交互的開始。該方法將接收與交互開始相關聯的滑鼠事件。
  • 該方法不接受任何參數。

代碼實例：

調用 _mouseStart 方法：

$( ".selector" ).mouse( "_mouseStart" );
    
_mouseStop() jQuery (plugin only) 擴展小部件應實現一個 _mouseStop() 方法，來處理交互的結束。該方法將接收與交互結束相關聯的滑鼠事件。
  • 該方法不接受任何參數。

代碼實例：

調用 _mouseStop 方法：

$( ".selector" ).mouse( "_mouseStop" );
    
_mouseUp() jQuery (plugin only) 處理交互結束。對擴展小部件的處理調用 _mouseStop 方法。
  • 該方法不接受任何參數。

代碼實例：

調用 _mouseUp 方法：

$( ".selector" ).mouse( "_mouseUp" );