鼠标交互

类别：交互 | 实用工具

鼠标交互

说明：基本交互层。

快速导航

选项

方法

事件

类似于 jQuery.Widget，鼠标交互不打算直接使用。它纯粹是其他小部件继承的基本层。此页面仅记录添加到 jQuery.Widget 的内容，但它确实包含不打算被覆盖的内部方法。预期的公共 API 是 _mouseStart()、_mouseDrag()、_mouseStop() 和 _mouseCapture()。

依赖项

选项

cancel 

类型：选择器
默认值："input,textarea,button,select,option"
防止交互在指定元素上启动。
代码示例

使用指定的 cancel 选项初始化鼠标

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

在初始化后获取或设置 cancel 选项

1
2
3
4
5
 
// Getter
var cancel = $( ".selector" ).mouse( "option", "cancel" );
 
// Setter
$( ".selector" ).mouse( "option", "cancel", ".title" );

delay 

类型：数字
默认值：0
鼠标按下后，交互开始前经过的毫秒数。此选项可用于防止在元素上单击时出现不需要的交互。（已弃用版本：1.12）
代码示例

使用指定的 delay 选项初始化鼠标

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

在初始化后获取或设置 delay 选项

1
2
3
4
5
 
// Getter
var delay = $( ".selector" ).mouse( "option", "delay" );
 
// Setter
$( ".selector" ).mouse( "option", "delay", 300 );

distance 

类型：数字
默认值：1
鼠标按下后移动的像素距离，交互才会开始。此选项可用于防止在元素上单击时出现不需要的交互。（已弃用版本：1.12）
代码示例

使用指定的 distance 选项初始化鼠标

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

在初始化后获取或设置 distance 选项

1
2
3
4
5
 
// Getter
var distance = $( ".selector" ).mouse( "option", "distance" );
 
// Setter
$( ".selector" ).mouse( "option", "distance", 10 );

方法

_mouseCapture()返回：布尔值

根据交互的事件目标确定是否应开始交互。默认实现始终返回 true。
  • 此方法不接受任何参数。
代码示例

调用 _mouseCapture 方法

1
 
$( ".selector" ).mouse( "_mouseCapture" );

_mouseDelayMet()返回：布尔值

确定当前交互是否已满足 delay 选项。
  • 此方法不接受任何参数。
代码示例

调用 _mouseDelayMet 方法

1
 
$( ".selector" ).mouse( "_mouseDelayMet" );

_mouseDestroy()返回：jQuery（仅限插件）

销毁交互事件处理程序。必须从扩展小组件的 _destroy() 方法中调用此方法。
  • 此方法不接受任何参数。
代码示例

调用 _mouseDestroy 方法

1
 
$( ".selector" ).mouse( "_mouseDestroy" );

_mouseDistanceMet()返回：布尔值

确定当前交互是否已满足 distance 选项。
  • 此方法不接受任何参数。
代码示例

调用 _mouseDistanceMet 方法

1
 
$( ".selector" ).mouse( "_mouseDistanceMet" );

_mouseDown()返回：jQuery（仅限插件）

处理交互的开始。验证事件是否与主鼠标按钮相关联，并确保在开始交互之前满足delay和distance选项。当交互准备开始时，调用扩展小部件的_mouseStart()方法进行处理。
  • 此方法不接受任何参数。
代码示例

调用_mouseDown方法

1
 
$( ".selector" ).mouse( "_mouseDown" );

_mouseDrag()返回：jQuery（仅插件）

扩展小部件应实现_mouseDrag()方法来处理交互的每个移动。此方法将接收与移动相关的鼠标事件。
  • 此方法不接受任何参数。
代码示例

调用_mouseDrag方法

1
 
$( ".selector" ).mouse( "_mouseDrag" );

_mouseInit()返回：jQuery（仅插件）

初始化交互事件处理程序。必须从扩展小部件的_create()方法中调用此方法。
  • 此方法不接受任何参数。
代码示例

调用_mouseInit方法

1
 
$( ".selector" ).mouse( "_mouseInit" );

_mouseMove()返回：jQuery（仅插件）

处理交互的每个移动。调用扩展小部件的mouseDrag()方法进行处理。
  • 此方法不接受任何参数。
代码示例

调用_mouseMove方法

1
 
$( ".selector" ).mouse( "_mouseMove" );

_mouseStart()返回：jQuery（仅插件）

扩展小部件应实现_mouseStart()方法来处理交互的开始。此方法将接收与交互开始相关的鼠标事件。
  • 此方法不接受任何参数。
代码示例

调用_mouseStart方法

1
 
$( ".selector" ).mouse( "_mouseStart" );

_mouseStop()返回：jQuery（仅插件）

扩展小部件应实现_mouseStop()方法来处理交互的结束。此方法将接收与交互结束相关的鼠标事件。
  • 此方法不接受任何参数。
代码示例

调用_mouseStop方法

1
 
$( ".selector" ).mouse( "_mouseStop" );

_mouseUp()返回：jQuery（仅插件）

处理交互的结束。调用扩展小部件的mouseStop()方法进行处理。
  • 此方法不接受任何参数。
代码示例

调用_mouseUp方法

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