Javascript 鼠标单击无法提供坐标_Javascript_Jquery_Html

Javascript 鼠标单击无法提供坐标

javascript jquery html

Javascript 鼠标单击无法提供坐标,javascript,jquery,html,Javascript,Jquery,Html,我想检索单击事件上的鼠标坐标并将其显示给我。目前它不工作这是我的剧本： <!doctype html> <html lang="en"> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> </head> <body> <script> $(d

我想检索单击事件上的鼠标坐标并将其显示给我。目前它不工作

这是我的剧本：

<!doctype html>
<html lang="en">
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
  <script>
    $(document).ready(
      $("#image").on({
        click: function (e) {
          x=e.pageX;
          alert(x);
        }
      })
    )
  </script>
  <img src="back.jpg" id="image" height="100px" width="100px" />
</body>
</html>


$（文件）。准备好了吗(
$（“#图像”）。在({
点击：功能（e）{
x=e.pageX；
警报（x）；
}
})
)

试试这个

$（文档）.ready（函数（）{
$（“#图像”）。单击（函数（e）{
x=e.pageX；
警报（x）；
});
});

试试这个

$（文档）.ready（函数（）{
$（“#图像”）。单击（函数（e）{
x=e.pageX；
警报（x）；
});
});
已编辑
简写函数在本地运行时对我不起作用，而函数块工作得很好，但在创建JSFIDLE时，这两个函数都工作得很好
已编辑
简写函数在本地运行时对我不起作用，而函数块工作得很好，但在创建JSFIDLE时，这两个函数都工作得很好

提示：尝试单击图像上的不同位置

函数showCoords（事件）{
var x=event.clientX；
var y=event.clientY；
var coords=“X coords:+X+”，Y coords:+Y；
document.getElementById（“demo”）.innerHTML=coords；
}

提示：尝试单击图像上的不同位置

函数showCoords（事件）{
var x=event.clientX；
var y=event.clientY；
var coords=“X coords:+X+”，Y coords:+Y；
document.getElementById（“demo”）.innerHTML=coords；
}
适合我。别的地方出了点问题。请先换个话题@synthet1c-不真实。你可以用任何一种方法。您的建议允许您一次添加一个处理程序，另一种方式允许您在单个调用中添加一组处理程序-每个处理程序1个属性。请看这里：为heads up@enhzflep干杯我已经删除了评论并刷新了我对该方法的了解。工作正常：对我有用。别的地方出了点问题。请先换个话题@synthet1c-不真实。你可以用任何一种方法。您的建议允许您一次添加一个处理程序，另一种方式允许您在单个调用中添加一组处理程序-每个处理程序1个属性。请看这里：为heads up@enhzflep干杯我已经删除了注释并刷新了我对该方法的了解。工作正常：OP共享的代码工作正常。。为什么要回答？人造丝问题是用ans编辑的。当时我用ans这个问题。这是不同的。稍后，问题被编辑。OP共享的代码工作正常。。为什么要回答？人造丝问题是用ans编辑的。当时我用ans这个问题。这是不同的。稍后，问题被编辑。OP共享的代码工作正常。。如果是，为什么要回答？事实上，那个代码对我不起作用。。所以我已经实现了我的！！！谢谢你的反对票，顺便说一句。什么不起作用？我在下面问题的评论中分享了这把小提琴。。检查…我已经将上述代码复制到我的机器中并进行了检查，但我也没有收到简单的警报。但是你的JSFIDLE正在工作！所以我不确定我以前复制的代码中有什么问题。调试它，顺便说一下，你是一名开发人员！OP共享的代码工作正常。。如果是，为什么要回答？事实上，那个代码对我不起作用。。所以我已经实现了我的！！！谢谢你的反对票，顺便说一句。什么不起作用？我在下面问题的评论中分享了这把小提琴。。检查…我已经将上述代码复制到我的机器中并进行了检查，但我也没有收到简单的警报。但是你的JSFIDLE正在工作！所以我不确定我以前复制的代码中有什么问题。调试它，顺便说一下，你是一名开发人员！
$(document).ready(function(){
    $("#image").click(function(e){
        x=e.pageX;
        alert(x);
    });
});

<!DOCTYPE html>
<html>
<body>


<p><strong>Tip:</strong> Try to click different places on image</p>
<img src="http://i164.photobucket.com/albums/u8/hemi1hemi/COLOR/COL9-6.jpg"  width="100" height="100"   onclick="showCoords(event)"/>
<p id="demo"></p>

<script>
function showCoords(event) {
var x = event.clientX;
var y = event.clientY;
var coords = "X coords: " + x + ", Y coords: " + y;
document.getElementById("demo").innerHTML = coords;
}
</script>                
     </body>
        </html>