Question

我正在制作一种证明格式，其中显示第一段，其余段落包含在“阅读更多”显示链接后面。在此处查看此操作：http://wlvrtn.com/sites/nms-site2/

我想要做的是：不是手动在阅读更多段落周围包装div并在之后放置一个按钮链接，我想在jQuery中自动执行此操作。

jQuery是否有可能嗅出所有blockquotes中的段落数量？它会在第一段之后的任何地方放置一个div标签，然后用“read-more”href跟随它。

我最擅长你。谢谢。

<section class="review">            

    <blockquote>

        <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec ullamcorper nulla non metus auctor fringilla. Aenean lacinia bibendum nulla sed consectetur.</p>

            <!-- BEGIN READ MORE -->                
            <div class="review-continued">

            <p>Vestibulum id ligula porta felis euismod semper. Maecenas faucibus mollis interdum. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>

            <p>Donec id elit non mi porta gravida at eget metus. Curabitur blandit tempus porttitor. Nullam id dolor id nibh ultricies vehicula ut id elit. Curabitur blandit tempus porttitor.</p>

            </div>         
            <a href="#" class="read-more">Read More +</a>       
            <!-- END READ MORE -->

    </blockquote>

    <cite>– Dr. John Doe, M.D., Livermore, CA</cite>

</section>

Answer 1

这应该这样做：

$('.review blockquote').each(function () {
    $('p:gt(0)', this).hide();
    var paras = this;
    $('a.read-more', this).click(function () {
        $('p:gt(0)', paras).slideToggle();
    });
});

<强> jsFiddle example

用jQuery自动化Read More Div

1 个答案: