Javascript 在jQuery中后台拉入HTML资源

页面上有一个按钮。单击按钮时，将显示一个下拉列表。下拉列表包含一个图像。问题是，直到用户单击按钮，图像才会被提取

$("#my_button").click(function(){
    $("#my_dropdown").html("<img src=\"http://mysite.com/image.jpg\" />"); 
});

$（“#我的_按钮”）。单击（函数（）{
$（“#我的#下拉列表”）.html（“”）；
});

我想在页面加载时获取图像，这样当用户单击下拉菜单时图像就可以运行了。我该怎么做？我想我可以将图像插入到设置了

display:none

的页面中，这样它就会进入缓存，或者在jQuery中加载文档时有没有办法加载

这是一个Chrome扩展，如果它有任何区别的话。我想我可以将图像放入扩展中（这样会更快），但我仍然好奇是否可以使用JS加载图像

谢谢，

---

Kevin

您可以预加载每个图像

$(document).ready(function() {
    (new Image()).src  =  '/path/to/myImage.jpg';
});

---

对。只需在页面的ready（）调用中将其定义为新图像：

$(document).ready( function() {
     var preload = new Image();
     preload.src = "http://mysite.com/image.jpg";
});

---

然后，当您使用它时，它将已经在浏览器的缓存中。您可以使用变量，也可以直接引用变量。

我首先得到了答案，基本上与您接受的答案相同。只是好奇你是如何选择接受哪一个答案的。@Sparky672，他可能只是羞于使用内联的惊人功能。你甚至需要ready（）调用吗？为什么不在执行时运行它？@KevinBurke我想不出任何理由。