Question

如何为div中的一堆链接添加jquery click事件处理程序？例如：

<div class="test">
<a href="test1.html">link 1</a>
<a href="test2.html">link 2</a>
<a href="test3.html">link 3</a>
</div>

我想为三个链接中的每个链接添加一个click事件处理程序，因此我可以将addClass（'selected'）添加到单击的链接中，并从其余链接中删除RemoveClass（'selected'）。

我知道我可以一个接一个地做，但我想知道最干净的方法是什么......

Answer 1

我会使用.delegate()：

var classname = 'selected';

$('div.test').delegate('a', 'click', function ()
{
    $(this).addClass(classname).siblings().removeClass(classname);
});

Answer 2

选择器将返回匹配的元素数组。

$('div.test a')

将是树链接。

$('div.test a').click(function() { });

将绑定到所有三个。

Answer 3

选择器的工作方式与CSS选择器类似，因此选择带有a

类的标签内的test个标签

$('.test a').click(function(){

    // select the object that was clicked on
    $(this)
        // add the selected class to it
        .addClass('selected')
        // remove the selected class from it's brothers and sisters
        .siblings().removeClass('selected')

    // stop link from loading and resetting page
    return false

})

在这里演示：http://jsfiddle.net/HK6CE/

Answer 4

我会写（没有额外的标记）：

$（'。test a'）。bind（'click'，function（）{

$（本）.addClass（ '选择'）的兄弟姐妹（）removeClass（ '选择'）;

}）;

兄弟姐妹（）在同一级别上获取所有其他dom元素，因此它会让所有其他元素“a”在里面.test

Answer 5

我相信它是$('.test').each(function(){})

jquery单击div中项目的事件处理程序

5 个答案: