j查询关闭 ul 如果打开了其他

jQuery close ul if other is opened

本文关键字:其他 如果 ul 查询      更新时间:2023-09-26

在这里需要一些帮助。 我有以下html/javascript

<div class="quick-links block">
        <div class="main-wrap container">
            <div class="row">
                <div class="col-sm-4 first column">
                    <div class="inner-content">
                        <h2>Admissions<a><img src="/sites/all/themes/merge/img/blue-down.png" /></a></h2>
                        <ul>
                            <li><a>Apply Now</a></li>
                            <li><a>Schedule a Visit</a></li>
                            <li><a>Student Life</a></li>
                        </ul>
                    </div><!--end inner-content-->
                </div><!--end col-->
                <div class="col-sm-4 second column">
                    <div class="inner-content">
                        <h2>Academics<a><img src="/sites/all/themes/merge/img/green-down.png" /></a></h2>
                        <ul>
                            <li><a>A Liberal Arts Degree</a></li>
                            <li><a>College of Arts &amp; Sciences</a></li>
                            <li><a>College of Business</a></li>
                            <li><a>College of Education</a></li>
                            <li><a>College of Health Sciences</a></li>
                        </ul>
                    </div><!--end inner-content-->
                </div><!--end col-->
                <div class="col-sm-4 third column">
                    <div class="inner-content">
                        <h2>Student Life<a><img src="/sites/all/themes/merge/img/gold-down.png" /></a></h2>
                        <ul>
                            <li><a>Campus Photo Tour</a></li>
                            <li><a>Student Organizations</a></li>
                            <li><a>Residence Life</a></li>
                            <li><a>Facilities</a></li>
                            <li><a>Food &amp; Drink</a></li>
                        </ul>
                    </div><!--end inner-content-->
                </div><!--end col-->
            </div><!--end row-->
        </div><!--end container-->
    </div><!--end quick-links-->
    <!-- ================================================ -->
    <!-- === QUICK LINKS JAVASCRIPT === -->
    <!-- ================================================ -->
    <script>
        var quickSection = $('.quick-links');
        var quickContent = $('.quick-links .row .inner-content')
        var quickList = $('.quick-links .row .inner-content ul');
        if ( quickSection.is('*') ) {
            quickContent.find("img").click(function() {
                $(this).closest(".inner-content").find("ul").slideToggle("slow");
                $(this).toggleClass("flipped");
            });
        }
    </script>

如果单击另一个"找到"的 img,我需要关闭显示的 ul。 基本上只需要关闭当前的ul,如果打开另一个。 任何帮助将不胜感激。

你也可以做这样的事情

quickContent.find("img").click(function() {
  $(this).closest(".main-wrap").find("ul").slideUp("slow"); // close all other
  $(this).closest(".column").find("ul").slideDown("slow"); // open current 
});

试试这个:

$(this).closest(".inner-content").find("ul").slideToggle("slow")
       .closest(".column").siblings().find("ul").slideUp("slow");

http://api.jquery.com/siblings