jquery - 如何获取下一个p元素的id？

Question

我想获取下一个 p 标签的 ID。

HTML:

 <h1>
    <span class=" edit">
    <a><i class="fa fa-edit"></i></a>
    <a id="remove"><i class="fa fa-trash-o"></i></a>
    </span>
</h1>
<p class="getty" id="1" href="#">One</p>

jQuery:

$('span.edit > a').click(function(e) {
    e.preventDefault();
    var x = $(this).next("p").attr('id');
    alert(x);

});

它没有发出任何警报。我哪里做错了？

Answer 1

p 元素是最接近父 h1 元素的单击 anchor 的下一个同级元素。您需要遍历到父 h1 元素，然后使用 .next() 选择器来定位它:

$(function(){
$('span.edit > a').click(function(e) {
 e.preventDefault();
 var x = $(this).closest('h1').next("p").attr('id');;
 alert(x);
});});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<h1>
<span class=" edit">
<a><i class="fa fa-edit"></i></a>
<a id="remove"><i class="fa fa-trash-o"></i>abc</a>
</span>
</h1>
<p class="getty" id="1" href="#">One</p>