0

我已经问过这个问题几次了，但这些建议似乎都没有奏效。

我正在使用 jstree 插件来构建树。基于node_id，我正在尝试将图像加载到一些div。它有点工作，但是，我有零星的图像显示问题。有时，我必须双击，有时单击显示图像。

我试过这个：

  img1 = new Image;
  img1.src="teamA.png";

  img2 = new Image;
  img2.src="teamB.png";

      img1.onload = function()
 { 

$("#div1").html(img1;
    }

等，但这不起作用。我仍然看到零星的图像现在出现在 div 上。

我开始看 jquery 插件 imgpreload 是这样的：

$.imgpreload(['img1','img2', 'img3','img4','img5','img6'], 
{     

    each: function()     { 

    $(this).data('loaded') 

    $("#div1").html(img1);
}
});

这似乎也不起作用，有什么想法或观点吗？

我已经这样做了：

$(function () {
var myImage1 = new Image();
$(img1)
    .load(function () {
    });


      .attr('src', 'teamA.png');
});

出现语法错误。你觉得这没问题吗？

* 更新 *我将代码修改为：

$(function () { 
    var myImage1 = new Image(); 
    $(myImage1).load(function () 
    {     
    })         
    .attr('src', 'teamA.png');
    alert(myImage1.width);  

    $('#div1').html("myImage1").css({"border": "0", "background": "white"});



}

在加载功能之后，我正在做一个：

alert(myImage.width) 查看图像的大小，它返回 0，所以这似乎不起作用。有明确的形象。

更新 v2

  $(function () { 
    var myImage1 = new Image(); 
    $(myImage1).load(function () 
    {     
    alert(myImage1.width);
    $('#div1').html("myImage1").css({"border": "0", "background": "white"});

    })         
    .attr('src', 'teamA.png');
    });

好的，假设图像在那里，这段代码可以工作。但我喜欢做的是，如果图像不存在，我喜欢隐藏那个 div。我有这段代码，但它不适用于加载事件。如何隐藏空的 div？

       $(function ()
           { 
            var myImage1 = new Image(); 
             $(myImage1).load(function () 
                  {  
                       var image1Check = myImage1.width;
               if (image1Check == 0  || image1Check < 30) 
                             {
                         $('#div').html("").css("border", "");

                     }
               else 
                     {

                         $("#div1").html(myImage1).css("border","1px solid");


                          }

    })         
                .attr('src', teamA.png);

    });
4

2 回答 2

1

在设置 src 之前绑定加载事件，并处理丢失的图像，使用.error()

$(function () { 
    var myImage1 = new Image(); 
    $(myImage1).load(function () {  
        $("#div1").html(myImage1).css("border","1px solid");
    }).attr('src', "teamA.png").error(function(){
        $('#div1').html("").css("border", "");
    });
});
于 2012-07-24T17:54:17.467 回答
0

您必须在 if 中使用 $(this).data('loaded')：

each: function() {
  if ($(this).data('loaded')) {
    // do something
  }
},
于 2012-07-20T18:58:57.017 回答