Question

任何更好的方法（假设我有10个a元素）？

$('#id > a:nth-child(1)').click(function() { changeP(1); return false; });
$('#id > a:nth-child(2)').click(function() { changeP(2); return false; });
$('#id > a:nth-child(3)').click(function() { changeP(3); return false; });

我知道两种可能性，但我并不特别喜欢它们：

使用带有参数的.bind()代替.click()
使用.map(return $(this))然后使用索引var

Answer 1

你可以这样做：

$('#id > a').each(function(i) {
  $(this).click(function() { changeP(i); return false; });
});

jQuery会将所选元素的索引作为第一个参数传递给“each”函数。

Answer 2

您可以使用index方法获取元素的索引（相对于它的父元素）：

$("#id > a").click(function() {
    changeP($(this).index() + 1);
    return false;
});

您需要添加1，因为元素索引从0开始，而nth-child从1开始。这是因为jQuery方法倾向于应用于匹配集中的所有元素，因此click事件处理程序绑定到与选择器匹配的所有元素。

Answer 3

$('#id > a').click(function(){
    changeP($(this).index(' #id > a')+1);
    return false;
});

请参阅：index()

即使在代码中插入了其他元素，这仍然有效：

<div id="id">
    <a href="#">1</a>
    <span>hello</span>
    <a href="#">2</a>
    <a href="#">3</a>
    <a href="#">4</a>
</div>

Answer 4

$.each( $('#id > a'), function(index) { 
  $(this).click(function() { 
   changeP(index); return false; });
 });

Answer 5

您正在寻找.each（）：http://api.jquery.com/each/

$('#id > a').each(function(index){
    $(this).click(function(){
        changeP(index+1);
    });
});

将相同的功能应用于许多元素（按顺序）

5 个答案: