防止父母點擊時點擊兒童

我想防止父母點擊時，我點擊兒童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

防止父母點擊時點擊兒童

回答

相關問題