2012-01-01 4 views
1

JSFIDDLE HERE При нажатии на .miniimg/2/3 он должен заменить ЦСИ из IMG классифицироваться .presentimg, который я прилагаемый с помощью JQuery в DIV .imgcontainer, я был через JQuery (НИЖЕ HTML) и единственная причина, я думаю, что это не будет работать из-за того я использовал функцию внутри функции, и я не знаю, альтернативный методJQuery на миниатюре нажмите заменить второй IMG SRC с СРК миниатюр

<div class="imgcontainer"> 
    <div class="minicontainer"> 
    <img src="http://lh3.googleusercontent.com/_Zuzii37VUO4/Ta0nUeMwXoI/AAAAAAAAFoc/7f0Um7OTgNg/s000/Antartic-by-Peter-Rejcek.jpg" title="icy mountains" class="miniimg"/> 
    <img src="http://lh3.googleusercontent.com/_Zuzii37VUO4/Ta0nUFUhg6I/AAAAAAAAFoY/GToUxRYcteY/s000/Antartic-by-Kelly-Speelman.jpg" title="icy planes and hills" class="miniimg2"/> 
    <img src="http://lh4.googleusercontent.com/_Zuzii37VUO4/Ta0nTs8AbPI/AAAAAAAAFoU/zCvNKv4kfe4/s000/BeachWaves-By-RePublicDomain.jpg" title="sun rise with clouds" class="miniimg3"/> 
    </div> 
</div> 

JQuery, в JQuery я использую (индекс) для внешней .each функции, как я видел ее на форуме, но я не знаю, действительно ли это работает ortuately

$(".imgcontainer").each(function(){ 
    var imgsrc = $(".minicontainer img:first-child").attr("src"); 
    $(this).append('<img src="'+imgsrc+'" class="presentimg"/>'); 
}); 
$(".miniimg").each(function(index){ 
    var $this = $(this); 
    $(this).click(function(){ 
     var miniimgrc = $this.attr("src"); 
     $(".presentimg").atrr('src', miniimgrc); 
    }); 
}); 
$(".miniimg2").each(function(index){ 
    var $this = $(this); 
    $(this).click(function(){ 
     var miniimgrc2 = $this.attr("src"); 
     $(".presentimg").atrr('src', miniimgrc2); 
    }); 
}); 
$(".miniimg3").each(function(index){ 
    var $this = $(this); 
    $(this).click(function(){ 
     var miniimgrc3 = $this.attr("src"); 
     $(".presentimg").atrr('src', miniimgrc3); 
    }); 
}); 

ответ

1

На самом деле, я думаю, ваша проблема в том, что у вас есть несколько опечаток из attr:

$(".presentimg").atrr('src', miniimgrc3); 

должен быть:

$(".presentimg").attr('src', miniimgrc3); 

Обновлено скрипка:http://jsfiddle.net/nv9em/

Кроме того, вы можете сократить свой код только один обработчик событий:

$(".imgcontainer").each(function() { 
    var imgsrc = $(".minicontainer img:first-child").attr("src"); 
    $(this).append('<img src="' + imgsrc + '" class="presentimg"/>'); 
}); 

$(".miniimg, .miniimg2, .miniimg3").click(function() { 
    var miniimgrc = $(this).attr("src"); 
    $(".presentimg").attr('src', miniimgrc); 
}); 

Обновлено скрипку:http://jsfiddle.net/Fr5yW/

+0

хорошо то будет неловко:/извините. – Fiddler

+0

@Fiddler: Нет проблем, иногда он просто берет вторую пару глаз ':)'. У меня есть предложение о том, как сделать все короче, а также –

+0

спасибо большое, но у меня есть еще одна проблема, которую я пытался использовать каждый, но он, похоже, не работает http://jsfiddle.net/nv9em/1/ – Fiddler