如何在jQuery的slideToggle执行后切换箭头图片？代码失效求助

问题核心原因 #

1. 选择器不匹配：HTML中触发点击的div是id="italia"，但你的jQuery代码绑定的是#nazione，导致点击事件根本无法触发。
2. 切换逻辑单一：仅设置固定的图片路径，无法实现点击后箭头方向来回切换的效果。

修正后的代码 #

HTML（无需修改）

<div id="italia">
    CONCESSIONI NAZIONALI<img id="freccia" src="freccia_su.jpg"  >
</div>

jQuery

$("#italia").click(function(){
    $(".estero").slideToggle("slow", function() { 
        // 获取当前箭头图片的路径
        var currentSrc = $("#freccia").attr("src");
        // 根据当前路径切换箭头方向
        if(currentSrc === "freccia_su.jpg"){
            $("#freccia").attr("src", "freccia_giu.jpg");
        } else {
            $("#freccia").attr("src", "freccia_su.jpg");
        }
    });
});

关键说明 #

• 修正点击事件的选择器，将#nazione改为#italia，确保点击div时能触发后续逻辑。
• 在slideToggle的回调函数中添加状态判断，根据当前箭头图片的路径切换为相反方向的图片，实现点击切换箭头的效果。

内容的提问来源于stack exchange，提问作者Lorenzo Donadio