jQuery如何使用event.isPropagationStopped()方法？代码实例

event.isPropagationStopped()方法在jQuery中用于检查对象event.stopPropagation()是否被调用。如果event.stopPropagation()被调用, 则返回true, 否则返回false。

语法如下：

event.isPropagationStopped()

参数：它包含单个参数事件这是强制性的。此参数来自事件绑定功能。

范例1：本示例使用event.isPropagationStopped()方法检查event.stopPropagation()是否被调用。

<!DOCTYPE html>
<html>
      
<head>
     <script src =
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
     </script>
      
     <script>
         $(document).ready(function() {
             $("button").click(function(event) {
                 event.stopPropagation();
                 alert("Is event.stopPropagation() called: " 
                         +  event.isPropagationStopped());
             });
         });
     </script>
</head>
  
<body>
     <h1>
         jQuery event.isPropagationStopped() Method
     </h1>
      
     <p>
         click on button to check if the 
         event.stopPropagation() is called.
     </p>
      
     <button>Check</button>
</body>
  
</html>

输出如下：

单击按钮之前：

单击按钮后：

范例2：本示例使用event.isPropagationStopped()方法检查event.stopPropagation()是否被调用。

<!DOCTYPE html>
<html>
      
<head>
     <title>
         event.isPropagationStopped method
     </title>
      
     <script src =
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
     </script>
</head>
  
<body>
     <h1>
         jQuery event.isPropagationStopped() Method
     </h1>
      
     <p> 
         click on button to check if the 
         event.stopPropagation() is called.
     </p>
      
     <button>Check</button>
      
     <div id = "GFG"></div>
       
     <script>
         function propStopped( event ) {
             var msg = "";
              
             if ( event.isPropagationStopped() ) {
                 msg = "True";
             } 
             else {
                 msg = "False";
             }
              
             $( "#GFG" ).append( "<div>" + msg + "</div>" );
         }
           
         $( "button" ).click(function(event) {
             propStopped( event );
             propStopped( event );
             event.stopPropagation();
             propStopped( event );
         });
     </script>
</body>
  
</html>

输出如下：

单击按钮之前：

单击按钮后：

更多前端开发相关内容请参考：lsbin - IT开发技术：https://www.lsbin.com/

查看相关的jQuery内容：

jQuery如何使用event.isPropagationStopped()方法？代码实例

一盏木人

引用和评论

如何在Java中将字符串转换为布尔值？

Javascript(turfjs)等值线图绘制

2024最全ECharts 实战大全（速记版+资源）

Jerry和您聊聊Chrome开发者工具

CSS 如何模拟“真实的”进度条？

一些react使用小技巧（中）

如何在仓库中添加只对自己生效的.gitignore规则？