使用next()获取被点击元素最近的一个div元素
使用next()获取被点击元素最近的一个div元素。
有如下代码：
<div id="div1">
<ul>
<li>
<p>第一个div的p元素</p>
</li>
</ul>
</div>
<div id="div2">
<ul>
<li>
<p>第二个div的p元素</p>
</li>
</ul>
</div>
<ul>
<li>
<p>第一个div的p元素</p>
</li>
</ul>
</div>
<div id="div2">
<ul>
<li>
<p>第二个div的p元素</p>
</li>
</ul>
</div>
需要完成的功能是，当点击id为div1元素中的p标签时，获取与div同级别的下一个div。
其实有多种方法，今天我们就讲讲使用parentsUntil和next综合起来的实例。
<script type="text/javascript">
$(document).ready(function(){
//$('#div1>ul>li>p').on('click',function(){alert($(this).parentsUntil('body','div').next().attr('id'))})
$('#div1 p').on('click',function(){
alert($(this).parentsUntil('body','div').next().attr('id'))
})
});
//body可以换成div的父元素
</script>
$(document).ready(function(){
//$('#div1>ul>li>p').on('click',function(){alert($(this).parentsUntil('body','div').next().attr('id'))})
$('#div1 p').on('click',function(){
alert($(this).parentsUntil('body','div').next().attr('id'))
})
});
//body可以换成div的父元素
</script>
在上面的js代码中，可以将第一个注释去掉，将下面的给注释掉，可以达到同样的效果。
