Bry*_*ahn 40 html javascript onclick onmouseclick
我有一个小div标签,当我点击它(onClick事件)时,它将运行该printMousePos()功能.这是HTML标签:
<html>
<header>
<!-- By the way, this is not the actual html file, just a generic example. -->
<script src='game.js'></script>
</header>
<body>
<div id="example">
<p id="test">x: , y:</p>
</div>
</body>
</html>
这是一个单独的.js文件中的printMousePos函数:
function printMousePos() {
var cursorX;
var cursorY;
document.onmousemove = function(e){
cursorX = e.pageX;
cursorY = e.pageY;
}
document.getElementById('test').innerHTML = "x: " + cursorX + ", y: " + cursorY;
}
是的,该函数实际上有效(它知道你何时点击它和所有),但它返回x和y的未定义,所以我假设函数中的get x和y代码是不正确的.有任何想法吗？我也知道javascript本身没有任何内置函数可以像java一样返回x和y,ex ..有没有办法用JQuery或php做到这一点？(尽管可能,尽量避免那些,javascript会是最好的).谢谢!
Jon*_*han 73
像这样.
function printMousePos(event) {
document.body.textContent =
"clientX: " + event.clientX +
" - clientY: " + event.clientY;
}
document.addEventListener("click", printMousePos);MouseEvent.clientX Read only
鼠标指针在本地(DOM内容)坐标中的X坐标.MouseEvent.clientY Read only
鼠标指针在本地(DOM内容)坐标中的Y坐标.
听起来你的printMousePos功能应该是:
目前,它这样做:
看到问题？您的变量永远不会被设置,因为只要将函数添加到"mousemove"事件中,就会打印它们.
看起来你可能根本不需要那个mousemove事件; 我会尝试这样的事情:
function printMousePos(e) {
var cursorX = e.pageX;
var cursorY = e.pageY;
document.getElementById('test').innerHTML = "x: " + cursorX + ", y: " + cursorY;
}