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元素已經準備就緒。