还有jquery图像滚动的麻烦吗_Jquery_Rollovers

还有jquery图像滚动的麻烦吗

jquery

还有jquery图像滚动的麻烦吗,jquery,rollovers,Jquery,Rollovers,好的，我仍然对下面的代码有一些问题。我从一些SO用户那里得到了一些指导，我对此表示感谢然而，我仍然对我在这里做错了什么感到困惑。我有一个使用图像的基本滚动jquery脚本。但是，当用户单击其中一个图像时，我希望该图像保持“活动/单击”状态。如果单击了另一个图像，我希望该图像处于“活动/单击”状态，而之前的活动/单击图像返回到关闭状态基本上，我希望它像一个选项卡控件一样工作，关闭、打开、激活。下面的代码可以正常工作，但单击除外。当我点击图像时，它会变为“活动”。但是，当我点击另一个图像时，它

好的，我仍然对下面的代码有一些问题。我从一些SO用户那里得到了一些指导，我对此表示感谢

然而，我仍然对我在这里做错了什么感到困惑。我有一个使用图像的基本滚动jquery脚本。但是，当用户单击其中一个图像时，我希望该图像保持“活动/单击”状态。如果单击了另一个图像，我希望该图像处于“活动/单击”状态，而之前的活动/单击图像返回到关闭状态

基本上，我希望它像一个选项卡控件一样工作，关闭、打开、激活。下面的代码可以正常工作，但单击除外。当我点击图像时，它会变为“活动”。但是，当我点击另一个图像时，它不会切换之前点击的图像，因此我最终所有的图像都处于“活动”状态。我尝试了我能想到的一切，并在谷歌上搜索了答案，但我尝试的一切都得到了相同的结果。单击而不是切换时，所有图像都保持“活动”

有谁能帮我看看，找出我在这里遗漏了什么。我刚开始使用jquery，我还在学习。顺便说一句，我知道这可以通过CSS来实现，但由于我正在努力学习，我宁愿理解我做错了什么，然后继续使用另一种方法。所以请不要建议我用CSS来回答这个问题。提前谢谢

$(document).ready(function() {
var sel;
    $("#nav a").mouseover(function() {
        if ( $(this).data("clicked") ) { return; }
        $(this).children("img").each(function() {
            this.src = $(this).attr("src").replace(/_off.gif$/ig,"_on.gif");
        });
    }).mouseout(function() {
        if ( $(this).data("clicked") ) { return; }
        $(this).children("img").each(function() {
            this.src = $(this).attr("src").replace(/_on.gif$/ig,"_off.gif");
        });
    //handle clicks
    }).click(function() {
        if( sel != null ) {
        $(this).children("img").each(function() {
            this.src = $(this).attr("src").replace(/_clk.gif$/ig,"_off.gif");

        });
        }
        $(this).children("img").each(function() {
            this.src = $(this).attr("src").replace(/_on.gif$/ig,"_clk.gif");
        })
        sel = this;
    });


}); 


</script>


<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
    <body>
        <div id="nav">
            <div id="logo"><img src="images/inbox_wrilogo.gif" width="143" height="30" alt="logo" border="0"  /></div>
            <div id="tab"><a href="#"><img src="images/nav_support_off.gif" width="75" height="22"  alt="Support" name="support" border="0"/></a></div>
            <div id="tab"><a href="#"><img src="images/nav_acct_off.gif" width="75" height="22" alt="My Account" name="acct" border="0" /></a></div>
            <div id="tab"><a href="#"><img src="images/nav_inbox_off.gif" width="75" height="22" alt="Inbox" name="inbox" border="0" /></a></div>
        </div>

$（文档）.ready（函数（）{
var-sel；
$（“#导航a”）.mouseover（函数（）{
if（$（this）.data（“单击”）{return；}
$（this）.children（“img”）.each（function（）{
this.src=$（this.attr（“src”）.replace（/\u off.gif$/ig，“\u on.gif”）；
});
}).mouseout（函数（）{
if（$（this）.data（“单击”）{return；}
$（this）.children（“img”）.each（function（）{
this.src=$（this.attr（“src”）.replace（/\u on.gif$/ig，“\u off.gif”）；
});
//手柄咔哒声
})。单击（函数（）{
如果（sel！=null）{
$（this）.children（“img”）.each（function（）{
this.src=$（this.attr（“src”）.replace（/\u clk.gif$/ig，“\u off.gif”）；
});
}
$（this）.children（“img”）.each（function（）{
this.src=$（this.attr（“src”）.replace（/\u on.gif$/ig，“\u clk.gif”）；
})
sel=这个；
});
});

好吧-您的点击功能需要查看

#nav

中的所有图像，以查看哪个图像被点击并将其关闭

而不是：

尝试：

还有-需要指出两件事：首先，在regexp中，

字符应该被转义。第二：如果您正在使用this.src=为什么不也在this.src上进行替换

$(this).children("img").each(function() {
            this.src = $(this).attr("src").replace(/_clk.gif$/ig,"_off.gif");

        });

$("#nav").find("img").each(function() {
  this.src = this.src.replace(/_clk\.gif$/i, "_off.gif");
});