zoukankan      html  css  js  c++  java
  • 用jquery阻止事件起泡 windrainpy

    jquery使用过程中阻止事件起泡实例  

    1、通过返回false来取消默认的行为并阻止事件起泡。

    jQuery 代码:

    $("form").bind("submit", function() { return false; })

     

    2、通过使用 preventDefault() 方法只取消默认的行为。

    jQuery 代码:

    $("form").bind("submit", function(event){
      event.preventDefault();
    });

     

    3、通过使用 stopPropagation() 方法只阻止一个事件起泡。

    jQuery 代码:

    $("form").bind("submit", function(event){
      event.stopPropagation();
    });

     

     

     

    关于js事件起泡的验证

    今天这个问题主要涉及到几个关键词:对象,触发事件,捕获事件,执行处理、起泡。这其实就是整个js执行的过程。其中冒泡这个过程很有意思。其实就像是一杯水,但是这杯水是分层次的,最底下是当前触发事件的对象。然后越往上范围越大,最顶层肯定是window,倒数第二层是document。气泡在上浮过程中会判断当前所到达的层有没有绑定事件处理方法。有话就执行相应的处理。没有的话就继续起泡。直到到达最顶层的window窗口层。我们可以在任何一层做相应的处理以阻止事件继续起泡。方法就是调用事件对象的阻止起泡的方法。event.stopPropagation();下面是写的一个验证js事件起泡的过程方法

    <script type="text/javascript">

        $(document).ready(function(){

            $('.one').click(function(e){

                alert('one');

            });

            $('.two').click(function(e){

                alert('two');

            });

            $('.three').click(function(e){

                alert('three');

               //阻止起泡取消下面的注释

               // e.stopPropagation();

            });

        });

    </script>

    <div class="one" style="200px;height:200px;background:green;">

    one

        <div class="two" style="150px;height:150px;background:yellow;">

        two

            <div class="three">

                three

            </div>

        </div>

    </div>

  • 相关阅读:
    System.IO.FileLoadException异常
    sql server 中文乱码
    WebMethod 属性
    解决局域网内无法IP访问IIS已发布的网站
    设备综合效率OEE
    一个可以学习工厂智能制造的公司网站-----太友科技
    groovy动态类型--能力式设计
    groovy对枚举的支持
    groovy实现循环、交换变量、多赋值、?.运算符
    规则引擎
  • 原文地址:https://www.cnblogs.com/windrainpy/p/2131651.html
Copyright © 2011-2022 走看看