当jQuery选项卡处于活动状态时，如何更改该选项卡上的图像？

我使用jQuery选项卡，每个选项卡都使用图像而不是文本。我想在选项卡处于活动状态时更改图像。选项卡本身的代码为：

<ul>
<li><a href="#tabs-1"><img src="images/dashboard_off.gif"/></a></li>
<li><a href="#tabs-2"><img src="images/advertising_off.gif"/></a></a></li>
<li><a href="#tabs-3"><img src="images/marketing_off.gif"/></a></li>
<li><a href="#tabs-4"><img src="images/office_off.gif"/></a></li>
<li><a href="#tabs-5"><img src="images/networking_off.gif"/></a></li>
<li><a href="#tabs-6"><img src="images/education_off.gif"/></a></li>
</ul>

我想切换到图像的“打开”版本（“images/dashboard\u on.gif”等等）

我的剧本是：

<script type="text/javascript">
$(function(){
    $( "#tabs" ).tabs({
    event: "mouseover"
    });
    });
</script>

$（函数（）{
$（“#制表符”）。制表符({
事件：“鼠标悬停”
});
});

---

任何帮助都将不胜感激

>不使用图像内联，可以考虑使用背景图像；这样，您就可以在

.ui-state-active

上关闭它

---

如果必须使用内联图像，可以尝试以下方法：

$(function(){
    $( "#tabs" ).tabs({
        event: "mouseover"
    })
    .find('> ul > li').hover(function() {
        $(this).find('img').prop('src', function(i, v) {
            return v.replace('off.gif', 'on.gif');
        });
    },
    function() {
        $(this).find('img').prop('src', function(i, v) {
            return v.replace('on.gif', 'off.gif');
        });
    });
});

---

你在使用标签插件吗？如果是，它是哪个？jQuery选项卡：

$（function（）{$（“#tabs”）.tabs（{event:“mouseover”}）；}）啊，jQueryUI选项卡。鼠标悬停还是点击事件？完整的HTML会很有帮助。我想保留鼠标悬停事件，但如果我必须切换到点击，那没关系。我只需要在选项卡处于活动状态时更改选项卡图像。但问题是，我需要“打开”图像不仅仅是一个悬停效果。我需要脚本来识别选项卡是活动的，而不仅仅是鼠标悬停在上面。