Jquery, как загрузить фотографию внутри div?

Question

У меня есть несколько фотографий:

<div class="photo">
 <a rel="example_group" href="http://download.com/79.jpg"><img class="edit_multimedia_img" src="http://download.com/79.jpg"></a>
 <a rel="example_group" href="http://download.com/80.jpg"><img class="edit_multimedia_img" src="http://download.com/80.jpg"></a>
 <a rel="example_group" href="http://download.com/81.jpg"><img class="edit_multimedia_img" src="http://download.com/81.jpg"></a>
 <a rel="example_group" href="http://download.com/82.jpg"><img class="edit_multimedia_img" src="http://download.com/82.jpg"></a>
 </div>

, и у меня есть div:

<div class="test"><div>

, что я хотел бы сделать, когда я нажимаю на любую ссылку фото, чтобы загрузить в.test div

может быть что-то вроде этого ??

$("a").click(function() {
  $(".test").html("<img src=' + this.href + '>");
});

любая идея помогает:)

спасибо

Answer 1

Создайте обработчик событий, создайте клон img, очистите ваш контейнер и добавьте клонированный img.

$('div.photo').delegate('a', 'click', function(e) {
  e.preventDefault();

  var img = $('img', this).clone();

  $('div.test').empty().append(img);

});

Наслаждайтесь:)

РЕДАКТИРОВАТЬ: Удалить .clone (), чтобы переместить его, а не скопировать его.

Answer 2

ДЕМО: http://jsfiddle.net/2VstH/

$(function(){
    $("#photos a").click(function(){
        image = $("<img />").attr("src", $(this).attr("href"))
        $("#test").html(image);
        return false;
    })
})

Answer 3

Это поможет:

$("a").click(function(e) {
    e.preventDefault();
  $(".test").html($(this).html());
});

Answer 4

$('div.photo').find('a').click(function() {
    $(this).find('img').appendTo('div.test');
    return false;
});

Неясно, хотите ли вы, чтобы это был единственный элемент в тестовом div. Если это так, просто сделайте это вместо:

$('div.photo').find('a').click(function() {
    var $test = $('div.test').empty();
    $(this).find('img').appendTo($test);
    return false;
})