如何创建一个函数来获取jquery中元素的下一个id并调用该函数

How to create a function to get next id of element in jquery and call this function?

本文关键字：函数 元素 下一个 jquery id 调用 创建 何创建 一个 获取      更新时间：2023-09-26

我创建了一个自定义函数goToNext()，它只是用来提醒我点击的下一个元素的id。

我想在另一个点击函数中调用这个自定义函数。

目前，当我点击第一个元素时，它会提醒id_2（第一个元素的下一个，所以没关系），但如果你点击第二个元素，它不会返回id_3（就像它应该的那样），但它会返回id_2，如果你点击最后一个元素（应该提醒第一个）

这是我在这里的jsfiddle示例

function goToNext() {
  var get_next_id = $('.btn').next().attr("id");
  alert(get_next_id);
}
$('.btn').click(function() {
  goToNext();
});
.btn {
  width: 50px;
  height: 50px;
  margin: 10px auto;
  background-color: yellow;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="btn" id="id-1">
  1
</div>
<div class="btn" id="id-2">
  2
</div>
<div class="btn" id="id-3">
  3
</div>

试试这个

function goToNext($btn){
var get_next_id = $btn.next().attr("id");
alert(get_next_id);
}
$('.btn').click(function(){
goToNext($(this));
});

您必须使用this

function goToNext(thisObj){
var get_next_id = $(thisObj).next().attr("id");
  if(get_next_id!=undefined)
      alert(get_next_id);
  else
      alert($(thisObj).parents().find("div:first").attr("id"));
}
$('.btn').click(function(){
goToNext(this);
});
.btn{
  width:50px;
  height:50px;
  margin:10px auto;
  background-color:yellow;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class ="btn" id="id-1">
1
</div>
<div class ="btn" id="id-2">
2
</div>
<div class ="btn" id="id-3">
3
</div>

您需要使用参考this

function goToNext(e){
    var get_next_id = $(e).next().attr("id");
    alert(get_next_id);
}
$('.btn').click(function(){
    goToNext(this);
});

更新的Fiddle

相关文章：