Question

我使用以下点击功能关闭联系表单并在导航栏上的链接上切换课程：

<script type="text/javascript">
$(document).ready(function(){
    $("#home").click(function(){
        $("#panel").slideUp("slow");
        $(this).toggleClass("current");
        $("#contact").toggleClass("current");
        return false;
    });
});
</script>

您可以在this page上查看该脚本。麻烦的是，如果联系表单处于打开状态（即div显示在页面顶部），我只想在联系链接上切换类。我如何在脚本中添加一个if子句“如果#panel在#contact上打开运行toggleClass？

谢谢，

尼克

Answer 1

尝试 -

if ($("#panel").is(":visible")) {
  //your code
}

Answer 2

您可以设置和删除类，而不是切换类。按照逻辑，当您点击a#home链接时，该链接应该获得current类，而#contact元素不应再具有current类。

$(this).addClass("current");
$("#contact").removeClass("current");

如果您想在表单不可见时不执行该功能，请使用：

$("#home").click(function(){
   if(!$('#panel').is(':visible')) return;
   //Rest of code

Answer 3

if($('#panel').is(':visible'))
  $(this).toggleClass("current");

Answer 4

有许多方法可以使用jQuery检查元素的可见性，但我不确定每个依赖的机制，并且考虑到我知道你的面板指定display:none这应该是帮助：

if ($("#panel").css("display") != "none") {

}

Answer 5

您可以进行可见的检查，例如if($("#contact:visible").length > -1)，但我看到if($("#contact"))足够的例子。

Answer 6

从版本1.3开始，.toggleClass()接受switch参数来确定是否应添加或删除类。

例如，使用以下代码：

 $("#contact").toggleClass("current", $('#panel').is(':visible'));

如果#contact可见，则该类会添加到#panel，否则会被删除。

如果div在jQuery中显示，我如何只运行函数？

6 个答案: