js中阻止事件冒泡行为

demo

场景:如demo所示,父标签div有个点击事件,其子标签span也有一个点击事件。

当点击父标签时,弹出提示框,没问题;

当点击子标签时,也弹出了提示框,与需求不符合,出现了问题。

 这是由于事件冒泡造成的后果,我们要做的就是阻止事件冒泡。

话不多说,上代码

goCharge(ev){

        if(ev && ev.stopPropagation){   

           ev.stopPropagation();  //非IE下 它支持W3C的stopPropagation()方法

      } else {   

        window.event.cancelBubble = true;  //IE的方式来取消事件冒泡

      }  

    }

ps : span标签里的就不用加参数ev了,如果事件里有跳转路由的话会报错

问题解决!

你可能感兴趣的:(js中阻止事件冒泡行为)