为啥我可以在控制台中看到 x 和 y 偏移量，但在我的网页上看不到？
Posted
技术标签:
【中文标题】为啥我可以在控制台中看到 x 和 y 偏移量，但在我的网页上看不到？【英文标题】：Why am I able to see the x and y offset in the console but not on my webpage?为什么我可以在控制台中看到 x 和 y 偏移量，但在我的网页上看不到？ 【发布时间】：2020-05-21 14:59:01 【问题描述】：我正在尝试在我使用 div 预先确定的某个区域内显示鼠标的坐标。当我查看 chrome 控制台而不是我的网页时，当我在 div 内移动鼠标时，我能够看到坐标动态变化。
<!DOCTYPE html>
<html>
<head>
<meta charset = "utf-8">
<title>Mouse Coordinates</title>
<link rel="stylesheet" type="text/css" href="style.css"> <link rel="stylesheet" type="text/css" href="style.css">
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="vue-app">
<div id="canvas" v-on:mousemove="XYcoordinates">
x,y
<div>
</div>
<script src="app.js"></script>
</body>
</html>
//App.js file
// this is a Vue instance
new Vue(
el:'#vue-app',
// data object
data:
x:0,
y:0
,
methods:
XYcoordinates: function(event)
console.log(event);
this.x = event.offsetX;
this.y = event.offsetY;
);
#canvas
width:600px;
padding: 200px 20px;
text-align: center;
border: 3px solid rgb(228, 0, 0);
【问题讨论】：
【参考方案1】：问题又回到未关闭的div标签上，可以看到链接https://jsfiddle.net/smaha/bajdmyhn/26/它工作了
<div id="vue-app">
<div id="canvas" v-on:mousemove="XYcoordinates">
x,y
</div>
</div>
【讨论】：
以上是关于为啥我可以在控制台中看到 x 和 y 偏移量，但在我的网页上看不到？的主要内容，如果未能解决你的问题，请参考以下文章
为啥我需要 00 时区偏移量才能在 d3v4 中正确显示值？
Bitmap.createBitmap(bitmap, x,y,width,height) 的正确偏移