无法处理<img>以像素为前缀的处理器

Question

我的问题很基本，但是我还是答不上来。

我有一个相当大的图像库显示在我的网站，所以我写了一个jQuery脚本扫描文件夹，收集图片来源，并把它们作为背景图像在正确的地方。

我的第二步是在上面添加一个图像的副本，并用Pixastic库处理它。我尝试使用下面的代码:

function blurBackground() {
$wrapper2.prepend('<img class="blur" src="'+$sourceImage+'" />'); // great, a copy of the image is set!
    $('.blur').load(function() {    // execute on load
        $('.blur').pixastic("blur").css('border','10px solid red'); // failed to process with pixastic, succeded to edit css
    });
}

如果我在我的标记中有一个现有的<img src="something.jpg" class="blur" />，一切都工作完美，即使我剥离函数并只使用该代码:

function blurBackground() {
 $('.blur').pixastic("blur");
}

问题是我不能处理任何预先或追加的图像。

我不知道我做错了什么。$sourceImage是100%正确的，并且图像总是在函数执行之前缓存。

Answer 1

在我看来，您需要在.load事件处理程序中使用.blur类指定this图像。

$('.blur').load(function() {   
    $(this).pixastic("blur").css('border','10px solid red');
});