使用 jquery imgAreaSelect 防止多个图像选择

Question

我正在使用流行的图像选择 jquery 插件 imgAreaSelect - http://odyniec.net/projects/imgareaselect

该页面可以包含任意数量的图像，因此我为图像分配了一个类，以在所有图像上启用代码。

$('img.select').imgAreaSelect({
...
});

问题是，一旦对任意一张图像进行了选择，我想防止对页面上的其余图像进行另一次选择。本质上，我希望禁用除我选择的图像之外的所有图像的插件。

我还希望能够在某个时候使用我保存的坐标再次编辑选择，因此这就是实例 api 的用武之地 - http://odyniec.net/projects/imgareaselect/usage.html#api-methods

因此，我会考虑做一些事情问题

var select1 = $('img.select1').imgAreaSelect({
...
});

var select2 = $('img.select2').imgAreaSelect({
...
});

etc

是没有定义数量的图像。我可以使用类似 $('img.select').each() 的东西吗？但仍然无法帮助向其附加数字。我认为设置 api 实例部分将有助于解决我的第一个问题。

我的问题是，如何使用 select 类为页面上的每个 img 动态创建一个 imgAreaSelect 实例（并且可能附加一个数字（我已将其存储在 name attr)) 并在选择图像时禁用页面上的所有其他实例？谢谢！

Answer 1

好的，我已经使用 .each() 来遍历每个图像并将 imgAreaSelect 的实例添加到数组中。从那里我可以调用我需要的任何图像。

var images = {};
var i = 1;
$('img.select').each(function (){
   images[i] = $('img.select.' + i).imgAreaSelect({
   ...
   });
   i++;
});

这可能不是最好或最有效的方法......但对我来说看起来很整洁。仍然愿意接受建议。