stop修饰符

阻止冒泡行为

可以在函数中利用$event传参通过stopPropagation()阻止冒泡

通过直接在元素中的指令中添加 .stop

prevent修饰符

阻止默认行为

可以在函数中利用$event传参通过preventDefault()阻止默认行为

通过直接在元素中的指令中添加 .prevent

 其他的事件修饰符

  • .stop
  • .prevent
  • .capture
  • .self
  • .once
  • .passive

事件修饰符可以串联使用，串联的顺序不一样，所表示的意思也不同

例如  .prevent.selt 表示阻止所有默认事件

.self.prevent表示只阻止自身默认事件

事件修饰符 阻止冒泡 .stop 阻止默认事件 .prevent的更多相关文章

  1. JS阻止冒泡和取消默认事件(默认行为)

    本文链接:http://caibaojian.com/javascript-stoppropagation-preventdefault.html 阻止事件冒泡 function(e){ if( e ...

  2. jQuery阻止冒泡和HTML默认操作

    1:jQuery是一个快捷简便的JavaScript框架,说道框架可以直接理解为就是对原来底层的东西进行了封装使得开发者能够利用这个框架快速开发. 2:在当今的各个浏览器中都支持事件的冒泡,所谓的冒泡 ...

  3. Vue学习笔记五：事件修饰符

    目录 什么是事件修饰符 没有事件修饰符的问题 HTML 运行 使用事件修饰符 .stop阻止冒泡 .prevent 阻止默认事件 .capture 添加事件侦听器时使用事件捕获模式 .self 只当事 ...

  4. vue指令与事件修饰符

    一.条件渲染指令 vue中提供了两个指令可以用于判断是否要显示元素,分别是v-if和v-show. 实例: <!DOCTYPE html> <html lang="en&q ...

  5. Vue学习之路第八篇：事件修饰符

    学习准备: ①.顾名思义,“事件修饰符”那么肯定是用来修饰事件,既然和事件有关系,那么肯定和“v-on”指令(也可简写为:@)有关系了. ②.事件修饰符有以下几类: .stop:阻止冒泡 .preve ...

  6. vue学习(六) 事件修饰符 stop prevent capture self once

    //html <div id="app"> <div @click="divHandler" style="height:150px ...

  7. Vue 事件的基本使用 && 事件修饰符

    1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8" /> 5 & ...

  8. JS如果阻止事件冒泡和浏览器默认事件

    原地址:http://missra.com/article/web-57.html 嵌套的标签元素,如果父元素和子元素都绑定了一些事件,那么在点击最内层子元素时可能会触发父级元素的事件,下面介绍一下J ...

  9. Vue.js-03：第三章 - 事件修饰符的使用

    一.前言 熟悉了 Vue 的指令系统后,在实际开发中,不可避免的会使用到对于事件的操作,如何处理 DOM 事件流,成为我们必须要掌握的技能.不同于传统的前端开发,在 Vue 中给我们提供了事件修饰符这 ...

随机推荐

  1. IDEA主题加高亮

    IntelliJ Idea的黑色主题,使用就是file-->import settings 选择压缩包里的jar包,主题就被导入了,之后会提示重启,重启完就可以在设置中使用了. IDEA主题下载 ...

  2. 交换机通过Loopback Detection检测(设备所在网络环路)

    组网图形  Loopback Detection简介 见上篇文章(详情见),不再赘述. 组网需求 如图1所示,某小型企业采用二层组网,所属VLAN为100.由于人员流动性大,网络拓扑变动频繁,变动往往 ...

  3. FL Studio水果音乐制作入门教程

    "没有早期音乐教育,干什么事我都会一事无成".这并非某位音乐家精心熬制的心灵鸡汤,而是出自物理学家爱因斯坦之口,朋友们没有看错,就是那个被称为二十世纪伟大科学家的爱因斯坦,所以,别 ...

  4. pytest和unittest中参数化如何做

    参数化应用场景,一个场景的用例会用到多条数据来进行验证,比如登录功能会用到正确的用户名.密码登录,错误的用户名.正确的密码,正确的用户名.错误的密码等等来进行测试,这时就可以用到框架中的参数化,来便捷 ...

  5. Linux服务器学习----haproxy+keepalived

    实验需要4台虚拟机,两台做服务器,两台做代理服务器 www1:ip:10.30.40.11       hk1: 代理:10.30.40.13(hk1.netdj.net) www2:ip  10.3 ...

  6. 02-Python里字符串的常用操作方法--split()函数和join()函数

    1.split() --分割,返回一个列表, 会丢失分割字符 实例: my_str = 'you and me and he' list01 = my_str.split('and') list02 ...

  7. VM15 Ubuntu18.04 安装c/c++

    输入"su"再输入密码即进入根用户,(gcc是默认安装的,但刚安装完成的系统中的gcc并不能用来开发,还缺少常用的头文件和库文件,还组要安装build-essential 软件包) ...

  8. 前端静态站点在阿里云自建 K8S DevOps 集群上优雅的进行 CI/CD

    目录 网站 域名 K8S DevOps 集群 私有 Gitlab 使用 Docker 编译站点 * Dockerfile * 构建编译 Image * 测试编译 Image * 推送镜像到 Aliyu ...

  9. Mac MySQL 8.0 (免安装版) 主从集群搭建

    一.下载解压包 打开 MySQL 官网地址:https://dev.mysql.com/downloads/mysql/ ,选择面安装版本. 二.解压文件 下载到合适文件夹,解压压缩包. 解压 mys ...

  10. Hyper-V 中设置虚拟机静态 IP

    一.新建虚拟网络交换机 二.配置网络 网络共享默认使用 192.168.137.0/255 作为内网地址,192.168.137.1 作为网关 三.配置虚拟机静态 IP 安装完成虚拟机后修改配置文件: ...