返回值:jQuerymouseup(handler(eventObject))
为 JavaScript 的 "mouseup" 事件绑定一个处理函数,或者触发元素上的该事件。
-
1.0 新增mouseup(handler(eventObject))
handler(eventObject) (Function) 每当事件触发时执行的函数。 -
1.4.3 新增mouseup([eventData], handler(eventObject))
eventData (Object) 可选参数,将要传递给事件处理函数的数据映射。handler(eventObject) (Function) 每当事件触发时执行的函数。 -
1.0 新增mouseup()
带有参数的该方法是 .bind('mouseup', handler)
的快捷方式 variation, and .trigger('mouseup')
in the second.
当鼠标指针正处在某元素上,并且在该元素上松开了鼠标,就会触发 mouseup
事件。任何 HTML 元素都可以接收该事件。
举例来说,请看下面的HTML:
<div id="target"> Click here </div> <div id="other"> Trigger the handler </div>
该事件可以绑定在任何 <div>
上:
$('#target').mouseup(function() { alert('Handler for .mouseup() called.'); });
现在,当你在元素上点击了鼠标,就会显示如下的提示框:
Handler for .mouseup() called.
我们也可以通过点击其它元素,手动触发另一个元素上的该事件:
$('#other').click(function() { $('#target').mouseup(); });
在代码执行后,如果你点击 Trigger the handler 将同样会弹出上面的消息。
如果用户在某元素外按下了鼠标,并且将鼠标指针移入到该元素上,此时再松开鼠标时,同样会触发 mouseup
事件。但是,这一系列操作对于大多数界面设计而言,并不作为 click
事件来看待。除非在特殊情况下,我们真正关注的是 mouseup
事件。
示例:
当触发 mouseup 和 mousedown 事件时,显示一段文本。
<!DOCTYPE html>
<html>
<head>
<script src="jquery.min.js"></script>
</head>
<body>
<p>Press mouse and release here.</p>
<script>
$("p").mouseup(function(){
$(this).append('<span style="color:#F00;">Mouse up.</span>');
}).mousedown(function(){
$(this).append('<span style="color:#00F;">Mouse down.</span>');
});
</script>
</body>
</html>