javascript - 显示内容 Jquery

Question

我正在尝试在#showcontent div 中显示图库中的内容。目前我有这个设置

Js

<script>
    $(document).ready(function() {
        $('.gallery-item').on('click', function(e) {
            $(".show-gallery-content").appendTo ("#showcontent").toggle();

        });
    });
</script>

索引.php

<?php
            $args = array('post_type' => 'Gallery', 'order' => ASC);
            $loop = new WP_Query($args);
            while ($loop->have_posts()) : $loop->the_post($post_id);
                echo '<div class="gallery-item">';


                echo '<div class="gallery-image">';
                the_content();
                echo '</div>';
                echo '<div class="show-gallery-content">';
                echo '<div class="gallery-title">';
                the_title();
                echo '</div>';
                echo '<div class="gallery-excerpt">';
                the_excerpt();
                echo '</div>';
                echo '</div>';
                echo '</div>';


            endwhile;
?>

CSS

.show-gallery-content {
display:none;
}

当前网站实时预览-> http://erwin.my89.nl/stage/sieh/

因此，当我单击图像时，我想让 the_title() 和 the_excerpt 显示在#showcontent 中。

我昨晚还好，但今天早上 PhpStorm 有点搞砸了，所以我现在真的很沮丧 :D。

提前致谢!

我还想了解一些背景信息，因为我是一名学生:-)!

Answer 1

试试这个:

<script>
$(document).ready(function() {
    $('.gallery-item').on('click', function(e) {
        $("#showcontent").append($(".show-gallery-content").html()).show();
    });
});
</script>