Javascript 无法捕获鼠标位置，因此无法捕获像素数据

转载问题现在更清楚了

我拥有的是一个有x张图片的页面。我想做的是能够点击任何图像的任何部分，并使特定颜色在点击的图像中透明<代码>将其Alpha值改为0

因此，图像：

<div id="resizeImg" style="width:300px; left:50px;" class="pic">
    <img id="image" src="http://myurl.com/images/3727.jpg" width=300 />
</div>
<div id="resizeImg" style="width:300px; left:50px;" class="pic">
    <img id="image1" src="http://myurl.com/images/3728.jpg" width=300 />
</div>
<div id="resizeImg" style="width:300px; left:50px;" class="pic">
    <img id="image2" src="http://myurl.com/images/3729.jpg" width=300 />
</div>

在这一部分中，我需要返回clickde像素的RGB，并用每个V值替换220

if (
    // this is where I need to return the RGB found and replace 220
      pixel[p+r] >= 220 &&
      pixel[p+g] >= 220 &&
      pixel[p+b] >= 220)

编辑

当我尝试使用以下工具查看inspector中的坐标时：

// show x + y
console.log("x=" + x + ", y=" + y);

---

它返回

x=NaN，y=NaN

如果你想找到鼠标相对于图像的位置，你应该像这样使用点击事件本身

$('[id^=image]').click(function (e) {
   // an array representing the relative x\y mouse coordinates within the image
   var relativeMousePosition=[e.pageX-$(this).offset().left,e.pageY-$(this).offset().top];

})

---

可能重复的问题应该编辑以前的问题，而不是发布基本相同的问题。@AndyE我做了编辑，一些用户说最好发布新问题？？我想一个选项是删除以前的问题。@AndyE删除了以前的问题

$('[id^=image]').click(function (e) {
   // an array representing the relative x\y mouse coordinates within the image
   var relativeMousePosition=[e.pageX-$(this).offset().left,e.pageY-$(this).offset().top];

})