e.preventDefault() 没效果,我用错了吗?

Question

目的,禁止点击outDiv 以外的区域, 
onMounted(() => {
    const outDiv = document.getElementById('team-content') as HTMLDivElement
    document.addEventListener('click', (e) => {
        if (!outDiv.contains(e.target as HTMLElement)) {
            console.log('permission_scheme>>>>>>>>>>>>>点了外面>>>>>', outDiv.parentElement)
            e.preventDefault()
        }
    })
})

Answer 1

preventDefault是阻止默认行为，比如submit事件阻止表单提交。如果是阻止冒泡执行父容器绑定事件，应该用stopPropagation。

题主具体要实现什么？不允许点击除outDiv外的内容触发事件可以用pointer-events控制事件穿透

<style>
    *{pointer-events:none}
    #team-content{pointer-events:auto}
</style>
<div onclick="alert(this.innerHTML)">1111</div>
<div onclick="alert(this.innerHTML)">2222</div>
<div onclick="alert(this.innerHTML)">3333</div>
<div id="team-content" style="height:300px;border:solid 1px #ccc" onclick="alert('team-content')">
    team-content，点击这里才会触发onclick事件
</div>
<div onclick="alert(this.innerHTML)">1111</div>
<div onclick="alert(this.innerHTML)">2222</div>
<div onclick="alert(this.innerHTML)">3333</div>