防止父母点击时点击儿童

我想防止父母点击时，我点击儿童SPAN。我试图防止父母点击时点击儿童

e.stopPropagation 

    and thi way 

    if (!e) e = window.event; 
    e.cancelBubble = true; 
    if (e.stopPropagation) e.stopPropagation();

我有HTML这样的：

<label for="parent_id"> Some text 
    <span id="child_id">Click child</span> 
</label> 
<input id="parent_id" />

的父元素功能

$（ '＃PARENT_ID'）点击（函数（E）{ SomeParentCode }

。

子元素函数

$('#child_id').click(function (e) { 
     e.stopPropagation(); 
     But I what to prevent parent click 
     SomeChildCode 
}

来源

2017-06-02 Mag

请格式化您的问题。如果您想为代码添加注释，请使用注释标记，即'/ * * /'或'//'，以便语法突出显示正常工作。 – nem035

我们还想在您的问题中[mcve] – j08691

[父项事件，点击子项（事件冒泡）]的可能重复项（https://stackoverflow.com/questions/27275279/event-on-parent-click-孩子事件冒泡） – Michelangelo

您需要通过调用ev.preventDefault

$(function() { 
 
    $('#child').click(e => { 
 
    e.preventDefault() 
 
    
 
    console.log('click on child') 
 
    }) 
 
    
 
    $('#parent').click(() => { 
 
    console.log('click on parent') 
 
    }) 
 

 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label for="parent"> 
 
    <span id="child">Click Me</span> 
 
</label> 
 
<input type="text" id="parent">

来源

2017-06-02 15:31:43

谢谢。还有一个问题。如何在同一个示例中处理移动设备上的css悬停。单击我出现在父级悬停上。 – Mag

@Mag没问题。关于你的第二个问题。谈到移动浏览器时，我不擅长css esp。我想你最好用相应的标签问另一个问题。 –

使用的preventDefault和stopPropagation防止默认动作（其中的重点是输入）。

$('#child_id').on('click', function (e) { 
      e.preventDefault(); 
      e.stopPropagation(); 
});

来源

2017-06-02 15:31:56

防止父母点击时点击儿童

回答

相关问题