Question

我有一个带有重复锚点的页面

<div id ="div1">
 <a class='button id='edit1'>Edit</>
<a class='button id='Close'>Close</a>
</div>
<div id ="div2">
 <a class='button id='edit2'>Edit</>
<a class='button id='Close'>Close</a>
</div>
<div id ="div3">
 <a class='button id='edit3'>Edit</>
<a class='button id='Close'>Close</a>
</div>

当我点击编辑锚点时，我需要在div中找到下一个关闭锚点并隐藏为。

这是我尝试的方式。

var anchors = $("a[class='button']");
    var position = anchors.index($('a[id=edit' + ID + ']'));
    var next = anchors.get(position + 1);
**next.hide();** // Can i hide like this.

有什么建议吗？

如果您注意到我的近锚将具有共同的ID，那么我可以使用ID

更多细节我可以在函数中完成吗

function abc(id){ 
$('a[id=edit' + id + ']').next('.change').hide();
}

Answer 1

看看这个fiddle

HTML：

<div id ="div1">
 <a class='button edit' id='edit1'>Edit</a>
<a class='button close' id='close1'>Close</a>
</div>
<div id ="div2">
 <a class='button edit' id='edit2'>Edit</a>
<a class='button close' id='close2'>Close</a>
</div>
<div id ="div3">
 <a class='button edit' id='edit3'>Edit</a>
<a class='button close' id='close3'>Close</a>
</div>

JS：

$('.edit').click(function() {
    $(this).next('.close').hide();
});

Answer 2

在jquery

中使用next（）函数

$(".edit").click(function(){
     $(this).next(".close").hide();
});

顺便说一句，你不能在几个项目上拥有相同的ID。改为使用类。

Answer 3

<div id ="div1">
 <a class='button edit' id='edit1'>Edit</a>
<a class='button Close'>Close</a>
</div>

添加edit类

$("a.edit").click(function(){
$("a.Close").show(); //show the previously hidden element
$(this).next("a").hide(); //hide the intended one
});

<强> DEMO

jQuery查找下一个锚元素并隐藏它？

3 个答案: