我想从链接加载图像:
1)点击“a href”,从href / src / id中提取图片网址
2)链接应该在加载Image时消失并显示Ajax-Loader Image。
3)显示加载的图像。
如果有可能我不想使用任何按钮或div结构输出图像 - 只有一个简单的链接。
点击:
<a class="loc" href="./misc/images/image1.png"></a>
浏览器应输出图像:
<img src="./misc/images/image1.png" />
到目前为止我做了这个:
$('a.loc').text('load image').css("cursor","pointer");
$('.loc').click(function(){
$(".loc").fadeOut(300);
$(".loc").html('<img src="/images/ajax-loader.gif" />');
var image = $(this).attr('src');
*** how to show/load image, how to use my var ??? ***
});
有人知道如何完成这项任务吗?我很感激任何帮助。
你可以使用replaceWith:
var image = $(this).attr('src');
$(this).replaceWith('<img src="'+ image +'">');
但是,显示加载图像的方法将无法正常工作。您应该在代码中添加一些prefetching logic,并在获取图像后使用replaceWith
。