0

我正在尝试使用容器内div的类检查和清除任何 s 。s在页面加载时默认隐藏,但在用户单击链接时出现。它可以出现在多个地方,因为该链接在多个地方都可用。demoFormdivdemoForm divaddUser

在添加新的之前,我想清除容器内可能已经由用户之前生成的任何现有的。

我目前这样做:

$(".addUser").click(function(){
        $('.demoForm').hide();
    });

我怎样才能使用 if else 或类似的东西来只检查打开的并关闭它们,而不是像我一样简单地做。

<!DOCTYPE html>
<html>
<head>
<title>Generated by Edit Plus</title>
<link rel="stylesheet" href="http://localhost/site/css/bootstrap.css" media="screen">
<script type="text/javascript" src="http://localhost/site/scripts/jQueryCore.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $(".addUser").click(function(){
        $('.demoForm').hide();
    });
    });
</script>

<style type="text/css">
.toolOptions{
    display:none;
}
</style>
</head>

<body>

<div class="container">
    <div class="addUser">Add a new user</div>

    <div class="demoForm">
    I'm the form div.
    </div>

    <div class="demoForm">
    I'm the form div.
    </div>

    <div class="demoForm">
    I'm the form div
    </div>
    </div>

</body>
</html>
4

3 回答 3

2

您可以使用选择器选择所有可见的 div:visible并仅隐藏它们:-

$(".addUser").click(function () {
    $('.demoForm:visible').hide();
});
于 2013-10-22T11:52:24.250 回答
1

使用:visible

$(".addUser").click(function(){
    $('.demoForm:visible').hide();
});
于 2013-10-22T11:52:40.503 回答
1

此处无需使用 If else 语句。你可以很容易地做到这一点:visaible

例如

$(".addUser").click(function(){
    $('.demoForm:visible').hide();
});

或者

$(".addUser").click(function(){
    if($('.demoForm').is(':visible')){
      $('.demoForm').hide();
    }
});

或者

$(".addUser").click(function(){        
    if($('.container').find('.demoForm').is(':visible')){
      $('.container').find('.demoForm').hide();
    }
});

或者

$(".addUser").click(function(){
    $('.container').find('.demoForm:visible').hide();
});
于 2013-10-22T11:56:18.817 回答