Question

我正在调试我写的背景图片幻灯片。

脚本的流程是它加载第一个图像并显示它然后调用preloadImages函数，然后以预设的间隔加载其余的图像。

preload_img是在我的插件（var preload_img = 1;）的开头定义的全局变量，它跟踪当前正在预加载的图像编号并保持其值应该如此，但此值不是被应用于图像的title属性。

// load the images in sequence one after another
function preloadImages()
{
    clearInterval(interval_preload);

    var div = '<div id="'+options.id_holder+preload_img+'" class="bg_img_holder"></div>';
    $('#'+options.id_wrapper).append(div);

    var img = new Image();

    //alert("loading: " + options.img_path + images[preload_img].image + " " + preload_img);
    $(img).load(function()
    {
        alert("loaded: " + $(this).attr('src') + " " + $(this).attr('title'));
        $img_holder = $('#'+options.id_holder+$(this).attr('title'));

        $img_holder.append(this)
        .css({
        'display':      'none',
        'background-color': images[$(this).attr('title')].background,
        'z-index':      -500
        })
        .find('img')
        .height($img_holder.width() * 0.5625);

    }).attr({
        'src':      options.img_path + images[preload_img].image,
        'title':    preload_img
    });

    //if there's another image to load after this one
    if(++preload_img < (images.length))
    {
        interval_preload = setInterval(preloadImages,1500);
    }
}

虽然在加载图像时定义了preload_img（第一个被注释掉的警报显示正确的值），但在加载图像时标题是一个空字符串（第二个未注释的警报）。

最初打开页面时，问题不会出现（打开浏览器，键入地址，按回车键）但每隔一段时间就会出现此问题。

这可能是我错过的一小部分，但我花了最后一小时来看这个并且我发疯了。

有一个非常基本的测试用例：http://jsfiddle.net/72Sy6/4/ 警报在我测试的所有浏览器中生成预期数据，除了IE7之外，在打开页面时具有预期数据，但所有其他时间都没有。

我提前为警报框道歉，但这是我在IE7中了解调试的唯一方法：X

编辑：使用幻灯片显示在IE 8中没有遇到错误，但是此测试用例显示局部变量同样未定义。

Answer 1

出于某种原因，我不完全确定，改变这个：

var img = new Image();
$(img).load(function(){
    //..
}).attr({
    'src':      options.img_path + images[preload_img].image,
    'title':    preload_img
});

到此：

var img = $('<img src="'+images[preload_img].image+'" title="'+images[preload_img].title+'" />');
$(img).load(function(){
    //..
});

修复了问题。

在IE 7和IE 8中加载图像时无法设置title属性

1 个答案: