jQuery.hover與AJAX無法正常工作

Question

我正在努力與我的jQuery的懸停結合$ .post。

我的目標是創建一堆選擇按鈕，如果我將它懸停，圖像將改變（此圖像的路徑將加載$ .post）。在鼠標懸停時，圖像將更改爲默認值。

如果點擊選擇按鈕，它會永久改變圖像。

問題是，即使在懸停時圖像有時也會永久更改。

試試看吧link text 嘗試將鼠標懸停在選區上一會兒，圖像就不會變回來。

我該如何解決這個問題？

var origpic; 
var klik; 
var inputval; 
var newpic; 
var origbnazev; 
var cesta = "/ajaxobrazek.php"; 
$("input[name='barva']").hover(function() { 
    klik = 0; 
    inputval = $(this).val(); 
    origbnazev = $("#bnazev").text(); 
    origpic = $("#kocarekimg").attr("src"); 
    $.post(cesta, {dodavatel_id : "<?php echo $row['dodavatel_id']?>", barva_cislo : inputval},  

    function(data){ 
     $("#kocarekimg").attr("src","/images/maly-"+data+".jpg"); 
    }); 
    $.post("/ajaxbarva.php", {barva_cislo : inputval}, function(data){ 
      $("#bnazev").text(data); 
     }); 

    },function(){ 
    if (klik == 0) { 
    $("#bnazev").text(origbnazev); 
    $("#kocarekimg").attr("src",origpic);} 
    }); 

    $("input[name='barva']").click(function() { 
    klik = 1; 

    $.post(cesta, {dodavatel_id : "<?php echo $row['dodavatel_id']?>", barva_cislo : inputval}, 

    function(data){ 
    $("#kocarekimg").attr("src","/images/maly-"+data+".jpg"); 
    origpic = "/images/maly-"+data+".jpg"; 
    }); 

    }); 

    //thumbnails 
    $(".imgtn").hover(function() { 
    origpic = $("#kocarekimg").attr("src"); 
    newpic = $(this).attr("src"); 
    newpic = newpic.replace("tn-","maly-"); 
    $("#kocarekimg").attr("src",newpic); 
    },function(){ 
    $("#kocarekimg").attr("src",origpic); 
    }); 

Answer 1

我在Chrome，Firefox和IE中都沒有問題。我所看到的唯一的事情就是該網站並沒有像它應該那樣快速響應，坦率地說 - 我不明白爲什麼你在加載後不會緩存圖像參考。

你的腳本在每次懸停時發出ajax呼叫，這是無稽之談。