Question

我获取所有记录并依次显示每篇文章。基本上在开始时隐藏了最后一个section#rest_of_profile但是当用户在第一部分中选择a#view_full_profile时，我想仅显示文章中的一个部分而不是每篇文章中的所有部分。我还没有找到解决方案。我得到的最接近的是展示他们所有，但隐藏了我想要展示的唯一一个。我感谢您提供的任何帮助/建议。

var allRecords = $('section#rest_of_profile').hide();
    $('a#view_full_profile').click(function(){
        allRecords.slideUp();
        $(this).parent().next().slideDown();
        return false;
    });

<article class="searched-record">
<section>
    <figure>
        <img src="http://digitalhumanlibrary.com/wp-content/themes/thematicChild/images/profile/anonymous-search-profile.png" alt="Member Profile Avatar">
    </figure>
    <nav class="member-social">
        <ul>
            <li><a href=""><span>&#102 </span></a>
            </li>
            <li><a href=""><span>&#108 </span></a>
            </li>
            <li><a href=""><span>&#116 </span></a>
            </li>
            <li><a class="member-skype" href=""></a>
            </li>
        </ul>
    </nav>
</section>
<section>
    <div><span>meBook: </span></div>
    <div><span>Contact Name: </span></div>
    <div><strong><span>Country: </span></strong>
    </div>
    <div><strong><span>Province/State: </span>'.$state.'</strong>
    </div>
    <div><strong><span>City: </span></strong>
    </div>
    <div><strong><span>Time Zone: </span></strong>
    </div>
    <div><strong><span>Program Focus: </span></strong>
    </div>
    <div><strong><span>Occupation: </span></strong>
    </div>
    <div><strong><span>Areas of Expertise: </span></strong>
    </div>
    <div><strong><span>Target Audience: </span></strong>
    </div>
    <div><strong><span>Video Conferencing Platforms: </span></strong>
    </div>  
    <a id="view_full_profile" href="">View Full Profile</a>

</section>
<section id="rest_of_profile">
    <div><strong><span>Email: </span><a href=""></a></strong>
    </div>
    <div><strong><span>Phone: </span></strong>
    </div>
    <div><strong><span>Website: </span></strong>
    </div>
    <div><strong><span>Profile Description: </span></strong>
    </div>
    <div><strong><span>Profile Learning Goals : </span></strong>
    </div>
    <div><strong><span>Curriculum Links: </span></strong>
    </div>
    <div><strong><span>Maximium # of Students: </span></strong>
    </div>
    <div><strong><span>Minimum # of Students: </span></strong>
    </div>
    <div><strong><span>Program Format: </span></strong>
    </div>
    <div><strong><span>Program Length: </span></strong>
    </div>
    <div><strong><span>Program Cost: </span></strong>
    </div>
    <div><strong><span>Technology Specifications: </span></strong>
    </div>
    <div><strong><span>How to Register: </span></strong>
    </div>
    <div><strong><span>Record: </span></strong>
    </div>
    <div><strong><span>Cancellation Policy: </span></strong>
    </div>
    <div><strong><span>Who Can Contact Me: </span></strong>
    </div>
</section>
<footer></footer>
</article>

Answer 1

我想通了，我更好地走了DOM。首先返回目标父母，然后选择我想要隐藏和显示的孩子。有兴趣看到一个更有效的解决方案，而不是为另一个隐藏按钮重复相同的代码，但目前她工作的美丽，这里是代码。

/**********************************/
    /*SEARCH PROFILE FUNCTIONS*/
/**********************************/
    $('section#rest_of_profile').hide();
    $('a#hide_full_profile').hide();
    //View Full profile Only
    $('a#view_full_profile').on('click',function(){
        $(this).parent('article.searched-record').children('section#rest_of_profile').toggle('slow');
        $('a#view_full_profile').hide();
        $('a#hide_full_profile').show();
    });
    //Hide Full profile Only
    $('a#hide_full_profile').on('click',function(){
        $(this).parent('article.searched-record').children('section#rest_of_profile').toggle('slow');
        $('a#view_full_profile').show();
        $('a#hide_full_profile').hide();
    });

一次隐藏和显示一条记录

1 个答案: