JQuery的.click触发子元素

Question

我有一个像这样的倍数div的页面

<div class="bigbox">
    <a href="http://www.somestuff.com">some stuff</a>
    more elements
</div>

我试图让每个div在点击时打开它里面的链接并尝试这样：

$('div.bigbox').each(function(){
    $(this).click(function(){
        window.open($(this).find('a').attr("href"));
})})

但是当点击实际链接时，它会打开两次。 点击我div中的链接时，有没有.click触发器的建议？

Answer 1

通过打开两次 ，我认为你的意思是在原始窗口和新窗口中遵循链接。

只需添加return false或e.preventDefault()即可停止此操作。

$('div.bigbox').click(function(e){
    e.preventDefault()
    window.open($(this).find('a').attr("href"));
});

Answer 2

你可以这样做：

$('div.bigbox').find('a').click(function(e) {
    e.preventDefault();
});

这样可以防止任何标签iniside .bigbox div触发其点击事件。

Answer 3

我相信你的代码非常接近。 试试这个：

$('div.bigbox').click(function()
{
    window.open($(this).find('a').attr('href'));
    return false;
});

return false应该使它不会打开多次，所以试一试，看看它是如何工作的。

Answer 4

你希望在单击div时调用你的处理程序，而不是在调用div中的链接时调用它？

如何添加

$('div.bigbox').each(function( event ){
  $(this).click(function(){

    // only perform the action if the div itself was clicked
    if ( event.target == this ) {
      window.open($(this).find('a').attr("href"));
    }
  })
})

Answer 5

在我看来，你最好这样做：

<a href="http://www.somestuff.com">
    <div class="bigbox">
        More elements
    </div>
</a>

如果您更喜欢使用javascript，您可以随时执行此操作：

$('div.bigbox').click(function(e)
{
    window.open($(this).find('a').attr('href'));
    e.preventDefault();
});