onmouseover = function ()这种写法,如何传入元素对象本身?

2021-01-22 00:48:15 +08:00
 qazwsxkevin

为了容易维护,方便区分表格,和测试等事情
我没有在 testtbl 的 table 标签上使用 onmouseover=someFunction(event,this)的方式去调用函数...
目前只用.onmouseover = function ()的

    tartable = document.getElementById('testtbl');
    tartable.onmouseover = function (event,obj) { // <--obj 改 this 是不行的
        t_clientX = event.clientX - obj.offsetLeft;
        y_clientY = event.clientY - obj.offsetTop;
        document.all('tester').innerHTML = t_clientX
    }

想获得鼠标在 testtbl 这个表格元素内的 tx,ty 坐标,
然后只在表格范围内画一个跟随鼠标游动的十字准星光标

1990 次点击
所在节点    JavaScript
8 条回复
ashong
2021-01-22 01:08:43 +08:00
=function(e){
e.target
}
wunonglin
2021-01-22 01:29:44 +08:00
你是想获取 tartable 本身?
document.getElementById('testtbl').onclick = function(e){ console.log(e.target) }
或者
document.getElementById('testtbl').onclick = function(){ console.log(this) }
都行,建议第二种
dd112389
2021-01-22 02:46:29 +08:00
没懂楼主的描述.
还有 document.all 不是个方法是个对象吧. 参考: https://developer.mozilla.org/zh-CN/docs/Web/API/Document/all
如果是想在一个容器内获取坐标直接绑定 mousemove 事件然后拿 event 获取不就好了?
如果你是想在事件中拿到自身元素的话可以这样写:
let table = document.querySelector('#testtbl');
table.onmousemove = function () {
console.log(this === table) // true
}
或者
table.onmousemove = () => {
console.log(table) // Element
}
Elethom
2021-01-22 02:54:51 +08:00
现在不会读文档也能当程序员了吗。
https://www.google.com/search?q=onmouseover+mozilla
qazwsxkevin
2021-01-22 08:25:20 +08:00
@Elethom 抱歉,正职还真的不是程序员,临时临急要上一些功能,如果打扰您了,万分抱歉
krixaar
2021-01-22 09:48:35 +08:00
这问题还没解决呢,不那么完美主义的话,换我早就一个十字线.svg 加几行 css 搞定了,至于十字线超出表格范围了,又不是强迫症……
rodrick
2021-01-22 10:46:01 +08:00
mouseover 是移入事件,e.target 是移入目标元素,e.relatedTarget 是移出对象。子元素的 mouseover 是会冒泡的,冒泡中 e.target 是当前冒泡到的元素,而 this 是 event 发生的元素。注意一下这几点就差不多了
SoloCompany
2021-01-23 18:13:56 +08:00
有被 document.all 笑到

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/747233

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX