如何在jquery中找到div外的元素

Question

当我点击按钮时，它将文本打印到最近的类“print”。请有人能帮助我吗？

HTML：

<div class ="row"> 
    <div id = "div1"> 
    <div class ="col-md-12"> 
     <button class ="button">print</button> 
    </div> 
    </div> 
    <div id ="div2"> 
    <div class ="print"> 
    </div> 
    </div> 
</div> 
<div class ="row"> 
    <div id = "div1"> 
    <div class ="col-md-12"> 
     <button class ="button">print</button> 
    </div> 
    </div> 
    <div id ="div2"> 
    <div class ="print"> 
    </div> 
    </div> 
</div> 

Answer 1

我认为你的答案是这样的：

$("button").click(function(e){ 
    var text = $(e.target).closest(".row").find(".print").text(); 

    alert(text) 
}) 

Answer 2

你可以使用closest() or parents()上去父div与row类，然后找到类元素print使用find()方法，最后得到文本使用text()：

$("button").on('click', function(e){ 
    console.log($(this).closest(".row").find(".print").text()); 
    //Or 
    console.log($(this).parents(".row").find(".print").text()); 
}) 

希望这会有所帮助。

$("button").on('click', function(e){ 
 
    console.log($(this).parents(".row").find(".print").text()); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class ="row"> 
 
    <div id = "div1"> 
 
    <div class ="col-md-12"> 
 
     <button class ="button">print</button> 
 
    </div> 
 
    </div> 
 
    <div id ="div2"> 
 
    <div class ="print">Print div 1 content</div> 
 
    </div> 
 
</div> 
 
<div class ="row"> 
 
    <div id = "div1"> 
 
    <div class ="col-md-12"> 
 
     <button class ="button">print</button> 
 
    </div> 
 
    </div> 
 
    <div id ="div2"> 
 
    <div class ="print">Print div 2 content</div> 
 
    </div> 
 
</div>