JS：获取鼠标点击位置

本文主要是介绍JS：获取鼠标点击位置，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

一、获取鼠标在目标元素中的点击位置

getClickPos.ts:

export const getClickPos = (e: MouseEvent) => {return {x: e.offsetX,y: e.offsetY,};
};

二、获取鼠标在页面中的点击位置

getClickPos.ts:

export const getPageClickPos = (e: MouseEvent) => {return {x: e.pageX,y: e.pageY,};
};

三、获取鼠标在视口中的点击位置

getClickPos.ts:

export const getClientClickPos = (e: MouseEvent) => {return {x: e.clientX,y: e.clientY,};
};

四、使用

<template><button @click="clickHandler">
</template>
<script setup lang="ts">
import { getClickPos } from "./getClickPos";
const clickHandler = (e: MouseEvent) => {const pos = getClickPos(e);console.log(pos);
};
</script>

这篇关于JS：获取鼠标点击位置的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---