Загрузка изображений в тег DIV

Question

У меня есть список изображений в теге div с идентификатором sIMG.

Пример:

<div id="sIMG"> 
<img src="1.jpg" title=""/> 
<img src="2.jpg" title=""/> 
<img src="3.jpg" title=""/> 
<img src="4.jpg" title=""/> 
<img src="5.jpg" title=""/> 
<img src="6.jpg" title=""/> 
</div> 

Теперь если я нажимаю на любое изображение, мне нужно загрузить в sIMG сНу тега.

Мой код выглядит следующим образом, но, кажется, только для загрузки первого изображения:

jQuery(document).ready(function(){ 
    jQuery('#sIMG img').click(function(){ 

     /* Get the sources */ 
     var currentSRC = jQuery('#sIMG img').attr('src'); 
     var altSRC = jQuery('#sIMG img').attr('title'); 
     alert(currentSRC) 
     /*Fade, Callback, swap the alt and src, fade in */ 
     jQuery('#IMGHolder').fadeOut('fast',function(){ 
      jQuery('#IMGHolder').html('<img src='+currentSRC+' title='+altSRC+' />'); 
      jQuery('#IMGHolder').fadeIn('fast'); 
     }); 
    }); 
}); 

Я делаю что-то здесь не так?

Answer 1

Использование

$(this) для доступа к текущему элементу внутри обработчика событий.

jQuery(document).ready(function(){ 
     jQuery('#sIMG img').click(function(){ 
      /* Get the sources */ 
      var currentSRC = jQuery(this).attr('src'); 

      var altSRC = jQuery(this).attr('title'); 

      alert(currentSRC); 

      /*Fade, Callback, swap the alt and src, fade in */ 

      jQuery('#IMGHolder').fadeOut('fast',function(){ 
       jQuery(this).html('<img src='+currentSRC+' title='+altSRC+' />').fadeIn("fast");      
      }); 
     }); 

    }); 

Answer 2

я делаю что-то здесь?

Возможно. Внутри обработчика $(this) вы получите дескриптор jQuery на объекте, который был нажат. Вероятно, вам понадобится jQuery(this).

Что делает ваш текущий код, он исчезает и ищет img элементов независимо от события click.

Ваш HTML также неверен:

<div id="sIMG"> 
<img src="1.jpg" title=""/> 
<img src="2.jpg" title="""/> 
<img src="3.jpg" title="""/> 
<img src="4.jpg" title="""/> 
<img src="5.jpg" title="""/> 
<img src="6.jpg" title=""/> 
</div> 

Должно быть

<div id="sIMG"> 
    <img src="1.jpg" title=""/> 
    <img src="2.jpg" title=""/> 
    <img src="3.jpg" title=""/> 
    <img src="4.jpg" title=""/> 
    <img src="5.jpg" title=""/> 
    <img src="6.jpg" title=""/> 
</div> 

Игнорировать отступы, это """ я взял вопрос с.