我有以下结构
代码
<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 我如何阻止它重定向?
最佳答案
您需要停止将点击事件向上传播到 DOM 到 a
元素,并防止链接的默认行为:
$(document).on('click', ".click", function(e) {
e.stopPropagation();
e.preventDefault();
console.log($(this).data('id'))
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<a href="blah.html" class="re-direct">
<div class="1div"></div>
<div class="2div">
<div class="click" data-id="text">click</div>
</div>
</a>
关于javascript - 单击子 div 时如何停止父 href 标签的重定向?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24726358/