Javascript 我可以从对象'；什么方法？

我试图创建一个JavaScript对象，该对象创建一组DOM元素（具体来说是IMG标记）——四个函数（方法）是对象的一部分，一个构建图标组，三个是事件处理程序：单击、MouseOver和MouseOut

要正确定义事件处理程序，我需要知道作为对象实例的局部变量的名称，但无法确定它

在网页中：

...
var ip = new IconPicker(...)
...  </script> ...

<li><a href="#" onclick="ip.buildIt("daImageBox"); return false;">boB's Icon Picker</a> <div id="daImageBox" class="iconPickBox"  hidden></div> </li>

。。。
var ip=新的IconPicker（…）
...   ...

在js文件中：

function IconPicker(...) { ... }

IconPicker.prototype.imageClicked = function(ctrl) { ... }

IconPicker.prototype.buildIt(divName) {
 ... "<img ... onClick='___.imageClicked(this)' ... />"

函数IconPicker（…）{…}
IconPicker.prototype.imageClicked=函数（ctrl）{…}
IconPicker.prototype.buildIt（divName）{
... ""

在这个例子中，uuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuu

假设有一个定义了类等的CSS文件

更棘手的部分（如果你已经知道这个技巧，可能很简单）是所有三个处理程序都需要一个参数，即单击（或悬停）组件的DOM实例

这在上面是通过'This'参数传递给imageClicked（）调用的——但是'This'在对象方法中有不同的含义，我要强调的是在同一定义中的双重需要：我需要将这个处理程序方法发送给'This'参数

---

诚然，确定实例变量的名称是一个笨拙的解决方案，但它可以解决问题。

我建议您创建一个DOM元素，而不是图像元素的字符串表示形式，这样您就可以使用

addEventListener（）

将单击事件绑定到它：

见下例：

函数IconPicker（消息、url、id）{
this.clickMessage=msg；
this.url=url；
this.id=id；
}
IconPicker.prototype.imageClicked=function（）{
console.log（this.clickMessage）；
}
IconPicker.prototype.buildIt=函数（）{
this.icon=document.createElement（'img'）；
this.icon.src=this.url；
this.icon.id=this.id；
this.icon.alt=“图标”；
var this_icon=此；
this.icon.addEventListener（'click'，function（）{
此图标已单击。imageClicked（）；
});
}
IconPicker.prototype.addIcon=函数（目标）{
target.appendChild（这个.icon）；
}
var myIcon=new IconPicker（“一些点击消息”）https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcS4eN1pqzmrn8pfD-g-LSTDIGMKBY22RVSWSJV7N0FC7OILRQIAW，“图标1 id”）；
myIcon.buildIt（）；
myIcon.addIcon（document.body）；
var myNewIcon=newiconpicker（“其他消息”）https://ih1.redbubble.net/image.316142692.7951/ap，550x550,12x12,1，透明，t.png，“图标2 id”）；
myNewIcon.buildIt（）；
myNewIcon.addIcon（document.body）；

img{
高度：150像素；
宽度：150px；
}

是否还有其他的

IconPicker

实例需要执行类似的操作？您能否发布调用

buildIt

的上下文？在几乎所有情况下，如果函数或对象需要知道已分配给它的变量的名称，您就做错了。这些变量名称有利于f函数/对象的所有者，可以自由更改这些名称（例如，通过复制到另一个变量）在不影响其内部结构的情况下。我已经编辑了问题，以接近您的两条评论。如果这有助于产生解决方案，甚至有助于向正确的方向推动我，那就太好了！这是我尝试采取的方向…我遇到的问题是，我的单击处理程序需要知道单击了哪个控件（控件位于重复数据行上，控件的id是必需的信息）。在类似的情况下，我通过在onClick调用中传递'this'来处理这个问题，我可以在函数中将其作为控件处理（在我的示例框架中称为ctrl）但是，当然，“this”在这个上下文中有不同的含义。除了这个障碍，这是我首选的方法。是否有一些注释可以用来调用处理程序，并引用作为参数单击的img标记？哦，我应该添加…buildIt（）创建一个图像网格，我需要知道要突出显示哪一个（鼠标悬停）、取消高亮显示（鼠标悬停）或保存（单击）--这样事件处理程序的参数。@boB您好，您可以使用

此图标访问选定的DOM元素（即单击的img）。然后您可以继续获取/设置其属性，如样式等。。。（我在第二段中给出了一个例子，通过点击图像的
id
属性）我喜欢这个想法，但这取决于对象中是否有一个成员引用了一个图标。这不是它的工作方式。IconPicker对象提供了几个图标供用户选择，我需要知道他们单击了哪个图标。一个IconPicker对象，多个图标。
IconPicker.prototype.buildIt = function(){
  this.icon = document.createElement('img');
  this.icon.src = this.url;
  this.icon.id = this.id;
  this.icon.alt = "A icon";
  var this_icon = this;
  this.icon.addEventListener('click', function() {
    this_icon.imageClicked();
  });
}