单击链接后使用jQuery加载图像

问题描述

我想从链接加载图像：

1）点击“ a href”，从href / src / id中提取图片网址

2）链接应该消失，并在加载Image时显示Ajax-Loader Image。

3）显示加载的图像。

如果有可能，我不想使用任何按钮或div-constructs输出图像-仅是一个简单的链接。

点击时：

<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 ??? ***

});

有谁知道如何完成这项任务？ 我非常感谢您的帮助。