jquery - 单击父级时获取 p 文本。 P 是许多同类的小组

Question

对于我正在处理的功能，我需要在单击父级 (.photoBackground) 时获取准确的 P 文本。 p 用作画廊的标题，因此有很多 P 具有相同的类别。我需要从我点击的那个文本中获取文本。然后我想将该特定文本复制到空的 .photoCaptionBig 类。我已经有了点击功能(其他一些功能需要它):$('.photoBackground').on('click',function ()。如何操作？

HTML:

            <div id="lightbox_caption_container">
                <a id="lightbox"></a>
                <div class="photoCaptionEffect">
                    <p class="photoCaptionBig" style="               
    "></p>
                </div>
            </div>

<div class="itemContainer">
                        <div class="photoBackground" id="photo1">
                            <div class="photoHoverEffect">
                                <p class="photoCaption" style="               
">TextTextText</p>
                            </div>
                        </div>
                    </div>

和 CSS:

.photoBackground {
    transition: box-shadow 0.3s ease;   
}
.photoBackground:hover{
    box-shadow: 0 0 0.938em rgba( 0, 0, 0, .7 );
    transition: box-shadow 0.3s ease;
}
.photoBackground:hover .photoHoverEffect {
    transition: opacity 0.4s ease;
    opacity: 1;
}
.photoHoverEffect, .photoCaptionEffect {
    height: 65px;
    width: 100%;
    margin-top: 155px;
    background-color: rgba(18,18,18,0.6);
    display: -webkit-inline-box;
    opacity: 0;
    transition: opacity 0.4s ease;
}
.photoCaptionEffect {
    height: 85px;
    opacity: 1;
    position: absolute;
    z-index: 1333;
    margin-top: 365px;  
}
.photoCaption, .photoCaptionBig {
    font-family: raleway;
    font-size: 13px;
    color: #fff;
    margin-top: 8px;
    margin-left: 8px;
    line-height: 16px;
    display: -webkit-inline-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

谢谢!

• 马格努斯· PIL 加德

Answer 1

在 jquery 中，如果你点击一个对象，你会像这样处理点击事件

$('selector').click(function() {
    //to find a p within what was clicked
    var $p = $(this).find('p');
    //if the p has a particular class
    var $p = $(this).find('p.particularClass');
    //to get the text in the p
    var $text = $p.text();
});

干杯。