单击子div时如何停止父href标签的重定向?

时间:2014-07-13 19:22:36

标签: javascript jquery html css href

我有以下结构

代码

 <a href="blah.html" class="re-direct">
    <div class="1div"></div>
    <div class="2div">
       <div class="click" data-id="text">click</div>
    </div>
 </a>
 <script>
  $(document).on('click',".click",function(){ alert($(this).data('id')) })
 </script>

上面的代码工作正常,但它重定向到页面blah.html如何阻止它重定向?

1 个答案:

答案 0 :(得分:6)

您需要停止将DOM上的click事件传播到a元素,并且还要阻止链接的默认行为:

$(document).on('click', ".click", function(e) { 
    e.stopPropagation();
    e.preventDefault();
    alert($(this).data('id')) 
});

Example fiddle