jQuery的图像互换不工作

Question

嘿所以我发现这个的jsfiddle http://jsfiddle.net/dEHZZ/1/

$('div#thumbs img').click(function() { 
$('#mainimg img').prop('src', $(this).prop('src')); 
return false; //stop link from navigating 
}) 

通过一些问题在这里滚动， 但其当我试图在这里http://ra-yon.com/beta/Test_sites/HFE/products/IR155R926.php

任何想法实现它不工作？

Answer 1

之前，你的DOModel被读取并准备进行操作

使用文档ready功能

$(function(){ // DOM ready to be manipulated 

    $('div#thumbs img').click(function(e) { 
     e.preventDefault(); //stop link from navigating 
     $('#mainimg img').prop('src', this.src); 
    }); 

}); 

此外，在你的代码，我看不到任何联系，所以实际上你的jQuery代码运行你不需要任何return false而不是event-preventDefault()（我用过）

http://api.jquery.com/ready/

Answer 2

包装你的jQuery在document ready call

$(document).ready(function() { 
    $('div#thumbs img').click(function() { 
     $('#mainimg img').prop('src', $(this).prop('src')); 
     return false; //stop link from navigating 
    }) 
}); 

的jsfiddle自动为您完成此这就是为什么它在那里工作。

Answer 3

放入准备好方法代码：

$(document).ready(function(){ 
    $('div#thumbs img').click(function() { 
    $('#mainimg img').prop('src', $(this).prop('src')); 
    return false; //stop link from navigating 
    }) 
}); 

你实例化你的代码之前的DOM元素已经准备就绪。