我想知道是否可以在单击 div/图像的不同区域时运行不同的 Javascript 函数。
例如，如果我有一张尺寸为 100px X 100px 的图片，并且我想在用户点击图片左上角 20% 的区域时显示提醒(即，如果用户点击 0% 到 100px 之间的区域)距图像顶部向下 20%，距图像左侧 0% 到 20%)，这可能吗？
如果是这样，如果用户在图像顶部下方 30%-40% 和 50-60 之间的区域内单击，我是否也可以运行不同的 Javascript 警报功能(具有不同的警报消息) % 从图像的左侧开始？
我需要使用高度和宽度的百分比来定义区域，而不是明确定义像素数。
这样的事情是否可能，如果可能，是否需要一个库来检测光标/触摸的位置？
最佳答案
您可以在点击事件上使用 position() 函数。 如果你的图片有 id="myImage"你可以这样做:
$("#myImage").click(function(e) {
var horizpercent = 20;
var vertpercent = 20;
var posX = e.pageX - $(this).position().left;
var posY = e.pageY - $(this).position().top;
var width = $(this).width();
var height = $(this).height();
if (posX < width * horizpercent / 100 && posY < height * vertpercent / 100) {
alert('ye')
}
});
关于javascript - 如何在单击 div/图像的特定区域时运行不同的 Javascript 函数，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45699593/