Javascript AJAX无法正常工作时的jQuery.hover

我正在努力将jquery悬停与$.post结合起来

我的目标是创建一组选择按钮，如果我将其悬停，图像将发生变化（此图像的路径将通过$.post加载）。图像将在鼠标移出时更改为默认值

如果点击选择按钮，图像将永久改变

问题是图像有时甚至在悬停状态下也会永久更改

你们自己试试吧 尝试将鼠标悬停在屏幕上一段时间，图像将不会重新更改

请问我该怎么修

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);  
    });  

var-origpic；
瓦尔·克里克；
var输入；
var newpic；
var origbnazev；
var cesta=“/ajaxobrazek.php”；
$（“输入[name='barva']”）。悬停（函数（）{
klik=0；
inputval=$（this.val（）；
origbnazev=$（“#bnazev”）.text（）；
origpic=$（“#kocarekimg”）.attr（“src”）；
$.post（cesta，{dodavatel_id:”，barva_cislo:inputval}，
功能（数据）{
$（“#kocarekimg”）.attr（“src”，”/images/maly-“+data+”.jpg”）；
});
$.post（“/ajaxbarva.php”，{barva_cislo:inputval}，函数（数据）{
$（“#bnazev”）。文本（数据）；
});
}，函数（）{
如果（klik==0）{
$（“#bnazev”）.text（origbnazev）；
$（“#kocarekimg”）.attr（“src”，origpic）；}
});  
$（“输入[name='barva']”）。单击（函数（）{
klik=1；
$.post（cesta，{dodavatel_id:”，barva_cislo:inputval}，
功能（数据）{
$（“#kocarekimg”）.attr（“src”，”/images/maly-“+data+”.jpg”）；
origpic=“/images/maly-”+数据+“.jpg”；
}); 
});
//缩略图
$（“.imgtn”）.hover（函数（）{
origpic=$（“#kocarekimg”）.attr（“src”）；
newpic=$（this.attr（“src”）；
newpic=newpic.replace（“tn-”，“maly-”）；
$（#kocarekimg”）.attr（“src”，newpic）；
}，函数（）{
$（#kocarekimg”）.attr（“src”，origpic）；
});  

我在Chrome、Firefox和IE中都没有任何问题。我看到的唯一一件事是，该网站的响应性没有达到应有的水平，坦率地说，我不明白为什么在加载图像引用后不缓存它们

---

您的脚本在每次悬停时都会进行ajax调用，这是胡说八道。

我希望您的代码在JS文件中的格式更好。你应该尽量保持它的整洁，这样更容易发现语法错误。如果我慢慢地将鼠标悬停在所有选择上，将所有图像引用加载到一个数组中，那么当我执行任何操作时，它都会正常工作。但如果在此之前我做了任何快速的动作（ajax正在使用），它就会再次出错：-（。