0

我正在遍历一个对象对象，以按雇用年份获取员工并显示他们的肖像和姓名。这是我添加到 SharePoint 网站内容编辑器 Web 部件的自定义 html/javascript 文件。

var classes = { 
2013: { 
"image/path.png" : "name of employee", 
"image/path2.png" : "name of employee2" 
}, 
2012... 
}

我正在使用以下 jQuery 加载图像

        jQuery(document).ready(function($){
            $('li').on('mouseover', function(e){
                $('#overlay').empty();
                var title = $('<h2>');
                title.text('Class of ' +  e.target.id);
                $('#overlay').append(title);

                $.each(classes[e.target.id], function(k, v) {
                    var img = $('<img/>');
                    img.attr('src', k);
                    var $imgContainer = $("<span class='imagesContainer'>");
                    $imgContainer.append(img);
                    $imgContainer.append("<span class='names'>" + v + "</span>");
                    $('#overlay').append($imgContainer);
                }); 
            });
        });

和要显示的 HTML：

    <ul id="classes">
        <br>
        <li id="2013">Class of 2013</li>
        <li id="2014">Class of 2014</li>
        <li id="2015">Class of 2015</li>
    </ul>

    <div id="overlay"></div>

问题：

1) 当我将鼠标悬停在 Class Years 链接上时，它会显示所有的肖像和姓名，但有时不会var classes = {显示对象中的所有图像。似乎有时并非所有这些都加载。例如，Class of 2013 对象中有 7 张图片，所以 jQuery$.each函数应该加载所有 7 张图片，但有时只出现 6 或 5 张。

2) 图像在 IE8 上根本不显示。当我将鼠标悬停在课程上时，只出现标题“Class of 20XX”，没有图像/名称。我认为这不是 jQuery 版本问题。

在这里提琴

4

0 回答 0