next() 函数获得紧跟着匹配元素的下一个兄弟元素标签，仅选择的是兄弟，而非孩子元素。
next() 函数可以允许通过选择器来进行过滤，如next(‘div’)被用来选择紧跟着的div兄弟元素 如紧邻的兄弟元素不为div标签，则不会选择任何元素。
具体实例代码：
<html>
<head>
<style type="text/css">
div,p{
width:110px;
height:40px;
margin:2px 8px 64px 8px;
float : left;
border :1px blue solid;
}
</style>
<script type="text/javascript" src="../jquery-1.11.1.min.js"></script>
</head>
<body>
<h1>jquery next() example</h1>
<div id="start">this is div1
<div>div 1 child</div>
</div>
<p>this is paragrap 1</p>
<div>
this is div2
<div>div2 child</div>
</div>
<div>this is div3
<div>div 3 child</div>
</div>
<br/><br/><br/>
<br/><br/><br/>
<button id="nextButton1">next()</button>
<button id="nextButton2">next('div')</button>
<button id="nextButton3">next('p')</button>
<button id="reset">Rest</button>
<script type="text/javascript">
var $currElement=$("#start");
$currElement.css("background","red");
$('#nextButton1').click(function(){
if(!$currElement.next().length){
alert("no element found!");
return false;
}
$currElement=$currElement.next();
$('div,p').css('background',"");
$currElement.css("background","red");
});
$("#nextButton2").click(function(){
if(!$currElement.next('div').length){
alert("no element found");
return false;
}
$currElement=$currElement.next('div');
$("div,p").css("background","");
$currElement.css("background","red");
});
$("#nextButton3").click(function(){
if(!$currElement.next('p').length){
alert("no element found");
return false;
}
$currElement=$currElement.next('p');
$('div,p').css("background","");
$currElement.css("background","red");
});
$("#reset").click(function(){
location.reload();
});
</script>
</body>
</html>效果图：
159
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
