英文网站title,沈阳网站开发培训价格,wordpress heart,网站免费模板鼠标事件使用
mousedowncanvasDown($event)按下事件合集
click 点击某个对象时触发
mousedown 鼠标按钮被按下时触发
mouseup 鼠标按钮被松开时触发
mouseleave 当鼠标指针移出元素时触发
dblclick 双击时触发
mousemove 鼠标移动时触发#xff0c…鼠标事件使用
mousedowncanvasDown($event)按下事件合集
click 点击某个对象时触发
mousedown 鼠标按钮被按下时触发
mouseup 鼠标按钮被松开时触发
mouseleave 当鼠标指针移出元素时触发
dblclick 双击时触发
mousemove 鼠标移动时触发持续触发
mouseout 鼠标从某元素移开时触发
mouseover 鼠标移到某元素上时触发
mouseenter 鼠标移到某元素上时触发
contextmenu 右键触发区分说明
mouseover 鼠标指针移入事件所绑定的元素或其子元素都会触发该事件
mouseenter 鼠标指针移入事件所绑定的元素时会触发该事件如果一个元素没有子元素那么该元素绑定mouseover或者mouseenter两种事件效果没有区别鼠标每次移入元素时都只会触发一次事件 如果绑定了mouseover事件的元素存在子元素那么每次移入该元素时都会触发一次事件包括从外部移入和从子元素移入移入子元素时也会触发一次事件。
鼠标右键事件处理
方法1 contextmenu document.addEventListener(contextmenu, function (e) {e.preventDefault(); //阻止右键默认行为console.log(右键);// do something});方法2 mousedown document.addEventListener(mousedown, function (e) {e.preventDefault();//此时阻止右键默认行为不生效需要用方法1禁止该默认行为if (e.button 0) {console.log(你按下了鼠标左键!);} else if (e.button 1) {console.log(你按下了鼠标滚轮!);} else {console.log(您按下了鼠标右键!);}});关于鼠标右键的更多应用
templatedivdiv classbtn click.righthandleClick(1)右键/divdiv classbtn contextmenuhandleClick(2)右键/divdiv classbtn contextmenu.preventhandleClick(3)右键 阻止默认行为/divdiv classbtn contextmenuhandleClicks($event)右键 阻止默认行为/divdiv classbtn idbtn右键 来自监听/div/div
/templatescript
export default {mounted() {// 指定元素添加右键监听document.getElementById(btn).addEventListener(contextmenu, function (e) {e.preventDefault(); //阻止右键默认行为console.log(右键);});},methods: {handleClick(key) {console.log(右键, key);},handleClicks(e) {e.preventDefault(); //阻止右键默认行为console.log(右键, e);},},
};
/script
style scoped
.btn {height: 30px;border: 1px solid #000;
}
/style
