我想从网络服务器加载图片而不刷新页面。我有简单的页面：使AJAX jQuery JavaScript加载图片？

<body><h1>Test</h1> 
     <div id="mydiv"> 
     <img src="animals.jpg"/> 
     </div> 
</body> 
</html>

的一点是，animals.jpg内容的变化（即现在animals.jpg可狼的图片，但分钟后，将变成一只猫），但是名字（ animal.jpg）停留（服务器覆盖图像内容只有）所以我想要的是当我点击图片，它会重新从服务器加载它。

我怎么做，到目前为止（实际上它是由的例子，我发现碎片的:)）：

$(document).ready(function(){ 
     $('#mydiv').click(function(){ 
     //$('#mydiv').load("animals.jpg") // loads text instead of image 
     //$("#mydiv").append("<img src='animals.jpg'/>"); // appends old picture 
     //$("#mydiv").html("<img src='animals.jpg'/>") // not responds at all 
    }); 
})

没有工作，看到的评论。

虽然我可以加载HTML的：
loadme.html：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"/></script> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
    $('#mydiv').click(function(){ 
    $('#mydiv').load("h1.html") 
    }); 
}) 


</script> 

</head> 

<body><h1>Test</h1> 
<div id="mydiv"> 
load me! 
</div> 
</body> 
</html>

h1.html：

文本

现在，当我改变h1.html“文本'在别的东西上，我点击'加载我！'在load.html中它会一直更新内容。这就是我想用影像来实现：/

来源

2010-06-26 vladimirze

您需要更改图片的src属性才能重新加载。由于src应该保持不变，请在其末尾附加一个随机字符串。这会让浏览器认为这是一个新的图像。

$('#mydif>img').attr('src', 'animals.jpg?random=' + Math.random());

来源

2010-06-26 12:31:31 ceejayoz

谢谢，它终于工作了！ $（'img'）。attr（'src'，'animals.jpg？random ='+ Math.random（））; （稍作修改） – vladimirze 2010-06-26 13:15:33

-1

最简单的方式，对我来说：

<img id="myimg" src="animal.jpg"/>

刚刚成立的JavaScript src属性：

function f() 
{ 
    var img = document.getElementById("myimg"); 
    img.src = "your_new_pic.jpg"; 
}

当然，如果你需要的动画或其他很酷的东西，最好使用JQUERY。

来源

2010-06-26 12:31:00

不要以为你明白这个问题。他正在寻找一种方法来让JavaScript重新加载**一张图片（cachebusting）。 – ceejayoz 2010-06-26 12:49:28

使AJAX \ jQuery \ JavaScript加载图片？

文本

回答

使AJAX \ jQuery \ JavaScript加载图片？

文本

回答

相关问题