如何使用 JavaScript 中的内联 onclick 属性停止事件传播？

使用 HTML DOM stopPropagation() 方法通过内联 onclick 属性阻止事件传播，如下所述：

HTML DOM stopPropagation() 事件方法： stopPropagation() 方法用于停止传播事件调用，即调用父事件，我们可以使用 stopPropagation() 方法停止调用其子事件的传播，反之亦然。

句法：

event.stopPropagation()

示例 1：此示例通过在 元素的 onclick 上添加stopPropagation 方法来停止事件传播。

 
 
     
        
          
        
     
      
     
      
        
 
            GeeksForGeeks 
        
 
          
        

            
                Span Content
            
        
     
                    

输出：

• 在点击元素之前：
  
• 点击 元素后：
  

示例 2：此示例通过将 onclick 上的stopPropagation() 方法添加到 元素来停止事件传播。此示例通过将window.event.cancelBubble设置为 true 来处理Internet Explorer案例。

 
 
     
         
            How to stop event propagation with
            inline onclick attribute
        
          
        
            div {
                background: green;
            }
            span {
                background: red;
                color: white;
            }
        
     
      
     
      
         
            GeeksForGeeks 
         
          
        
            
                Span Content
            
        
          
        
        
            function StopEventPropagation(event) {
                if (event.stopPropagation) {
                    event.stopPropagation();
                }
                else if(window.event) {
                    window.event.cancelBubble=true;
                }
            }     
         
     
                    

输出：

• 在点击元素之前：
  
• 点击 元素后：