Question

我需要从div返回文本。当我点击点击我时，我想提醒来自div class='show_mail_middle'的文字

<div class='show_mail'>
<div class='show_mail_top'><p class='cli'>click me</p></div>
<div class='show_mail_middle'>1</div>
</div>


<div class='show_mail'>
<div class='show_mail_top'><p class='cli'>click me</p></div>
<div class='show_mail_middle'>2</div>
</div>

<div class='show_mail'>
<div class='show_mail_top'><p class='cli'>click me</p></div>
<div class='show_mail_middle'>3</div>
</div>

谢谢你的帮助！

Answer 1

纯JavaScript使用。

var allDiv = document.getElementsByClassName('show_mail_top');
for(var i=0; i<allDiv.length; i++){
    allDiv[i].onclick = function (){
        alert(this.nextElementSibling.innerHTML);
    }
}

DEMO

Answer 2

$('body').on("click",".show_mail_top",function(){
    alert($(this).find("p").text());
});

Answer 3

Fiddle Demo

$('.cli').click(function () {
    alert($(this).closest('div').next().text());
});

<小时/> 或Fiddle Demo

$('.cli').click(function () {
    alert($(this).parent().next().text());
          //^get parent element div of current element with class .cli which 
//clicked and than find next div element n get it's text
});

<小时/> .closest()

.next()

this keyword

Answer 4

您可以组合使用.closest()＆amp; .next()

使用

$('.cli').click(function () {
    alert($(this).parent().next('.show_mail_middle').text());
});

DEMO

OR

$('.cli').click(function () {
    alert($(this).closest('.show_mail_top').next('.show_mail_middle').text());
});

DEMO 2

Answer 5

$(".show_mail_top").click(function() {
   $(this).parent().children(".show_mail_middle").text();
});

Answer 6

尝试：

$('p.cli').click(function(){
   alert($('div.show_mail_middle').text())
});

Answer 7

<强> Demo

$('.cli').click(function() {

    var text = $(this).parents('.show_mail').find('.show_mail_middle').html();

     alert(text);
});

单击此div中的某个链接时从div返回文本

7 个答案: