释放所有先前捕获的鼠标事件
释放所有先前捕获的鼠标事件
功能:捕获鼠标事件
当浏览器不支持releaseCapture的时候,给浏览器的全局HTMLElement设置releaseEvents事件,让页面上所有的元素都有releaseCapture这个事件
releaseCapture可以将鼠标事件锁定在指定的元素上,当元素捕获了鼠标事件后,该事件只能作用在当前元素上
事例:
未使用UForm框架前
html:
<div id="div" style="width:200px;height:100px;background:red"></div>
js:
var _div=document.getElementById("div");
_div.onmouseover=function(){
if (!window.captureEvents) {
_div.setCapture();
console.log("捕获成功1");
}else {
window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP);
console.log("捕获成功2");
}
}
_div.onmouseout=function(){
if (!window.captureEvents) {
_div.releaseCapture();
console.log("释放成功1");
}else {
window.releaseEvents(Event.MOUSEMOVE|Event.MOUSEUP);
console.log("释放成功2");
}}
使用UForm框架
html:
<div id="div" style="width:200px;height:100px;background:red"></div>
js:
$("#div")[0].onmouseover=function(this.setCapture();console.log("捕获成功")}
$("#div")[0].onmouseout=function(this.releaseCapture();console.log("释放成功")}
点击提交后,鼠标移出可看到效果
注:当鼠标移到上面按钮时 弹出捕获当前元素,则释放成功
$("#but")[0].onmouseout=function(){this.releaseCapture();alert("释放先前捕获的鼠标事件")}
返回结果