防止点击事件的jquery方法

Question

我有许多包含链接内的图像的列表项。当点击其中一个链接时，我只想获取包含 li 的 rel 属性，而不跟随点击事件。目前跟随事件会在新页面中打开链接图像，这不是我想要的。

我尝试在函数中使用 return false;，但这并不起作用（请参见下面）。我还尝试在标记中的实际链接上执行此操作，但我宁愿不这样做，因为这不是最佳实践。

 $('a.main-img').click(function (){

    var liRel = $(this).closest('li').attr('rel');
    var relNumber = $('#banner-holder').find('img').attr('id', liRel);
    rotatePics(relNumber);

    return false;

});

- Cecil Theodore

Answer 1

请注意，preventDefault并不会阻止事件从DOM冒泡并被父级中的一个事件激活。函数event.StopPropagation可以做到这一点。PreventDefault停止链接的默认操作。而使用return false实际上两者都会做到，因此使用preventDefault不能精确地复制return false的功能。

这个SO问题详细介绍了这个问题。

虽然在这种情况下可能没有什么区别，但在某些情况下它确实曾经让我非常困惑。

- Crab Bucket

Answer 2

你应该学习关于 event.preventDefault() 和 event.stopPropagation() 的知识。

event.preventDefault()

event.stopPropagation()

- defau1t

Answer 3

尝试：

$('a.main-img').click(function (evt){
    evt.preventDefault();

- Sudhir Bastakoti

Answer 4

http://api.jquery.com/event.preventDefault/

阅读，这里有一个例子。

编辑：你的修正代码将是这样的：

 $('a.main-img').click(function (event){
     event.preventDefault();
    var liRel = $(this).closest('li').attr('rel');
    var relNumber = $('#banner-holder').find('img').attr('id', liRel);
    rotatePics(relNumber);    
 });

- Ryan Casas