Jquery在click事件中包含多个函数_Jquery

Jquery在click事件中包含多个函数

jquery

Jquery在click事件中包含多个函数,jquery,Jquery,单击“我希望此特定.父级”按钮时，将打开所有其他项，并将其折叠。下面的代码不适合我我想我不明白如何在下面的代码中使用this和误用e <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"

单击“我希望此特定.父级”按钮时，将打开所有其他项，并将其折叠。下面的代码不适合我

我想我不明白如何在下面的代码中使用this和误用e

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="/der/jquery.cookie.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    var selected;
    $(".parents").click(function(){
        selected = this.id;

        // Open list
        $("#" + selected + " ul").css("display", "block");

        // Remember opened list
        $.cookie('tree', '#' + this.id);

        // Cycle through all lists
        $(".parents").each(function(e){
            // Collapse all children that does not
            // belongs to the opened list
            if(e.id != selected) {
                $("#" + e.id + " ul").css("display", "none");
            }
        });
    });
});
</script>
<style type="text/css">
.child_list {
    display: none;
}
</style>
</head>
<body>
<ul id="tree">
    <li class="parents" id="parent_1"><a href="#">Parent 1</a>
        <ul class="child_list">
            <li class="child"><a href="#">Child 1</a>
            <li class="child"><a href="#">Child 2</a>
            <li class="child"><a href="#">Child 3</a>
        </ul>
    </li>
    <li class="parents" id="parent_2"><a href="#">Parent 2</a>
        <ul class="child_list">
            <li class="child"><a href="#">Child 1</a>
            <li class="child"><a href="#">Child 2</a>
            <li class="child"><a href="#">Child 3</a>
        </ul>
    </li>
</ul>
</body>
</html>


$（文档）.ready（函数（）{
选择var；
$（“.parents”）。单击（函数（）{
所选=此.id；
//开放列表
$（“#”+所选+“ul”）.css（“显示”、“块”）；
//还记得打开的列表吗
$.cookie（'tree'，'#'+this.id）；
//循环浏览所有列表
$（“.parents”）。每个（函数（e）{
//让所有没有的孩子崩溃
//属于打开的列表
如果（e.id！=选中）{
$（“#”+e.id+“ul”）.css（“显示”、“无”）；
}
});
});
});
.child_列表{
显示：无；
}

不要重新选择内容，而是相对于您单击的项目找到它们，如下所示：

$(function(){
  $(".parents").click(function(){
    // Open list
    $(this).find("ul").show();

    // Remember opened list
    $.cookie('tree', '#' + this.id);

    // Cycle through all lists
    $(this).siblings().find("ul").hide();
  });
});

（除了饼干以外的所有东西）。您还可以通过使用and而不是and来为其设置一点动画

上述方法使用，因此您可以从单击的

开始，然后四处移动以查找您想要的内容，例如，其他人关闭他们的孩子，等等。

更改

$(".parents").each(function(e){
            // Collapse all children that does not
            // belongs to the opened list
            if(e.id != selected) {
                $("#" + e.id + " ul").css("display", "none");
            }
        });

到

通常指一个事件，但作为你唯一的循环元素，那里没有事件，因此在每个元素中你可以使用它。

没有ID:）

$(".parents").each(function(){
            // Collapse all children that does not
            // belongs to the opened list
            id = $(this).attr('id');
            if(id != selected) {
                $("#" + id + " ul").css("display", "none");
            }
        });