Guffa のソリューションで十分かもしれませんが、通常、ループ内にクロージャを作成することはお勧めできません。あなたの側で多くのコード リファクタリングを必要とせず、再利用可能なコンポーネントを提供する別のアプローチがありますが、コードはもう少し多くなります。
// CALLBACK MANAGER MODULE BEGIN
// Create a manager for creating callbacks.
var callbackManager = (function () {
var win = window,
random = Math.random,
// Create a hash for us to save all callbacks on.
callbacks = {},
// Generates the next unique ID for a callback.
nextId = (function () {
var next = 1;
return function () {
var n = next;
next += 1;
return n;
};
}()),
// Generates the next valid callback name.
nextCallbackName = function (prefix) {
prefix = prefix || "___callback";
return prefix + nextId();
};
// Save our hash of callbacks on the window object
// so we can get access to the callbacks globally.
win.callbacks = callbacks;
return {
// Creates a callback that will call the specified
// method on the 'thisObj'. Can specify optional arguments
// to have passed to the method call:
//
// callbackManager.makeMethodCallCallback(myObj, "welcome", "Alex");
//
// The callback will be returned and saved so it can
// be accessed globally.
//
// Each callback will be a function with the following methods:
// getPath - Get the exported (i.e. global) path of the callback.
// dispose - Disposes the callback by nulling out all references
// and removing it from global access.
//
// makeCallback(thisObj, methodName, ...)
makeMethodCallCallback: function (thisObj, methodName) {
var name = nextCallbackName(),
args = Array.prototype.slice.call(arguments, 2),
callback = function () {
if (thisObj &&
typeof thisObj[methodName] === "function") {
return thisObj[methodName].apply(thisObj, args);
}
};
callback.getPath = function () {
return "window.callbacks." + name;
};
callback.dispose = function () {
thisObj = null;
callback = null;
args = [];
delete callbacks[name];
};
return callback;
};
};
}());
// CALLBACK MANAGER MODULE END
function imgHandler(divname) {
this.imgDiv = divname;
this.img = Array("bigoldlizard.png","scarytiger.gif");
// Define an array of callbacks.
var callbacks = [];
this.update = function() {
var htmlstr = "",
// Declare a local variable for a callback.
callback;
for(i=0; i<this.img.length; i++) {
// Create a new callback and save it so we can dispose it when
// this image is removed. We also pass the index of the image.
callback = callbackManager.makeMethodCallCallback(this, "remove", i);
callbacks.push(callback);
// All callbacks have a getPath() method that will return
// the callback's exported (i.e. global) path, such as "window.callbacks.__callback92".
htmlstr += '<img src="' + this.img[i] + '" onclick="' + callback.getPath() + '(); return false;/></span>';
}
$("#" + this.imgDiv).html(htmlstr);
}
//remove an image from the array
this.remove = function(index) {
if (index >= 0 && index < this.img.length) {
this.img.splice(index, 1);
this.update();
// Dispose the callback associated to this image
// then tombstone it so that the order other callbacks
// will be maintained.
if (callbacks[index]) {
callbacks[index].dispose();
// Tombstone the callback.
callbacks[index] = undefined;
}
return true;
}
else
return false;
}
}
Guffa のテクニックとこれはうまくいくはずです。
EDIT：あなたがjQueryを使用していることに気づいていませんでした。click()可能であれば、属性ではなくjQuery の event-helper を使用することをお勧めしonclickます。おそらく、私callbackManagerと Guffa のアプローチを組み合わせることで、両方の長所を活かすことができます。要素を作成<img>し、jQuery のclick()ヘルパーを使用し、再利用可能なコールバック マネージャー モジュールを使用します。