如何让JQuery在页面加载时加载图像？

Question

下面的代码工作正常“鼠标移动”，但我想要的图像显示在页面加载，并没有什么我已经改变使图像在页面加载显示。 任何帮助，非常感谢！ 感谢 伊恩

$(document).ready(function() { 

    $("body").mousemove(function() { 

    $("li.fsn-level-1").each(function() { 

     var imgCount = $(this).children("span").first().children("img").length; 

     if (imgCount < 2) { 
     $(this).children("span").first().prepend("<img id='imgPlus' src='images/plus.png' style='display:inline' />"); 
     $(this).children("span").first().prepend("<img id='imgMinus' src='images/minus.png' style='display:none' />"); 

     } 

     var closed = $(this).hasClass("closed"); 
     var open = $(this).hasClass("open"); 
     var first = !closed && !open; 
     if (first) { 
     $(this).removeClass("open") 
      $(this).removeClass("closed").addClass("closed"); 
     var sub = $(this).children("ul"); 
     if (sub.length) { 
      sub.hide(); 
     } 

     var plus = $(this).children("span").first().find("img[id='imgPlus']"); 
     if (plus.length) 
      plus.show(); 

     var minus = $(this).children("span").first().find("img[id='imgMinus']"); 
     if (minus.length) 
      minus.hide(); 
     } 


     $(this).unbind('hover').bind('hover', function() { 
     CloseAllSubMenu(); 
     var closed = $(this).hasClass("closed"); 
     var open = $(this).hasClass("open"); 
     var first = !closed && !open; 


     if (first || closed) { 
      $(this).removeClass("closed"); 
      $(this).removeClass("open").addClass("open"); 
      var sub = $(this).children("ul"); 
      if (sub.length) { 
      sub.show(); 
      } 

      var plus = $(this).children("span").first().find("img[id='imgPlus']"); 
      if (plus.length) 
      plus.hide(); 

      var minus = $(this).children("span").first().find("img[id='imgMinus']"); 
      if (minus.length) 
      minus.show(); 

     } 
     if (open) { 

      $(this).removeClass("open") 
      $(this).removeClass("closed").addClass("closed"); 

      var plus = $(this).children("span").first().find("img[id='imgPlus']"); 
      if (plus.length) 
      plus.show(); 

      var minus = $(this).children("span").first().find("img[id='imgMinus']"); 
      if (minus.length) 
      minus.hide(); 
     } 
     }); 
    }); 

Answer 1

它很难看到你正在尝试做的究竟，但是这是我发现：

你的页面后附加的图像是准备好了：

$(this).children("span").first().prepend("<img id='imgPlus' src='images/plus.png' style='display:inline' />"); 
$(this).children("span").first().prepend("<img id='imgMinus' src='images/minus.png' style='display:none' />"); 

这将导致图像在该时间点加载，即：您正在等待页面准备就绪（加载），然后您将它们附加，并强制它们在页面加载后加载。

如果您需要是动态的（它看起来像），尝试调用$(document).ready();之前运行它。它们将被包含在负载的文件这样（因此任何事情之后出现这种情况。

Answer 2

只是为了问一个愚蠢的问题，如果要加载在Page_Load中的图像，那么为什么不干脆把标签上页面开始，所以图像已经加载为文档的一部分

如果你想载入的图像文件准备好（页面加载后），但没有在鼠标悬停然后只是删除此

$("body").mousemove(function() { } 

...从您的JavaScript部分和其余部分将直接开枪，因为它不再被连接到鼠标移动功能离子。