当单击每个锚标记时,然后显示其自己的ID。但是现在我单击每个锚标记,然后显示相同的id check1。
<div id="test">
<a class="link" id="check1" href="#">1</a>
<a class="link" id="check2" href="#">2</a>
<a class="link" id="check3" href="#">3</a>
<a class="link" id="check4" href="#">4</a>
<a class="link" id="check5" href="#">5</a>
<a class="link" id="check6" href="#">6</a>
<a class="link" id="check7" href="#">7</a>
</div>
<script>
$(document).ready(function(){
$('#test a').click(function(){
var ids=$('a').attr('id');
alert(ids);
});
});
</script>
答案 0 :(得分:2)
使用$(this).attr('id')
。问题出在代码$('a').attr('id')
中,它获取了id
元素的<a>
。由于存在多个<a>
元素,因此它考虑第一个<a>
元素并采用其id
。使用$(this)
将获得单击的<a>
元素的范围。您甚至可以在点击功能内使用this.id
。
$(document).ready(function(){
$('#test a').click(function(){
var ids=$(this).attr('id');
alert(ids);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="test">
<a class="link" id="check1" href="#">1</a>
<a class="link" id="check2" href="#">2</a>
<a class="link" id="check3" href="#">3</a>
<a class="link" id="check4" href="#">4</a>
<a class="link" id="check5" href="#">5</a>
<a class="link" id="check6" href="#">6</a>
<a class="link" id="check7" href="#">7</a>
</div>