0

我遇到了一些我无法弄清楚的事情，我想知道你是否可以尝试一下。

首先，有这段代码：

<li class="mc002">
<ul>
    <li>
        <div class="label-container">
            <a class="btn">label 1</a>
            <a class="btn">label 2</a>
        </div>
        <div class="main-container">
            <div class="prj-title">
                <h3><a href="">New design for my website</a></h3>
                <div class="buttons">
                    <button data-role="none" class="btn smry">summary</button>
                </div>
            </div>
            <div class="summary">
            </div>
            <div class="prj-footer">
                <h6>filed under:</h6>
                <span>webdesign, webdevelopment, UX design</span>
                <h6>skills:</h6>
                <span>html5, css3, javascript, php</span>
            </div>
        </div>
    </li>

以及使“摘要”向下滑动的 JavaScript：

$('.main-container .smry').click(function () {
    $(this).closest(".summary").slideToggle(100);
});

问题在于它不起作用。请你帮帮我好吗？

4

2 回答 2

1

该.closest()方法没有找到兄弟姐妹或堂兄弟，它从当前元素（.smry，在你的情况下）开始并通过祖先，当它找到匹配时停止（或者如果没有匹配则返回一个空的 jQuery 对象）。

试试这个：

$('.main-container .smry').click(function () {
    $(this).closest(".main-container").find(".summary").slideToggle(100);
});

这将向上导航到最近的包含.main-container元素，然后用于.find()返回到其关联.summary元素。

演示：http: //jsfiddle.net/4a8JC/

Note that your code would need to be in a document ready handler and/or in a script block that appears after the elements in question.

(Note also that your summary div would need to have some actual content for this to make sense.)

于 2013-08-25T10:51:23.320 回答
0

I'll suggest to use just $(".main-container .summary") instead of closest. It's a little bit heavy operation. And do you have something in .summary. If it is an empty I don't think that you will see something.

于 2013-08-25T10:52:36.543 回答