VUE中
html 中
<ul id="shoppingList" v-on:click="addClass($event)" class="iview-admin-draggable-list">
  <li></li>
</ul>
点击li时
js如下
addClass:function(e){
  console.log(e.target);
  if(e.target.parentNode.className=="iview-admin-draggable-list"){
    e.target.classList.toggle("deleSign");
  }
}
$event表示的是你点击的元素,不是你事件绑定的元素,事件触发默认是冒泡机制
$event中无addClass事件,但可以用$event.target.classList.add事件代替
双击事件的话就是 e.target.classList.toggle("deleSign");
 
 
 
 

vue中点击添加class,双击去掉class的更多相关文章

  1. vue中点击不同的em添加class去除兄弟级class

    vue中使用v-for循环li 怎么点击每个li中的em给添加class删除兄弟元素 <html lang="en"> <head> <meta ch ...

  2. vue中点击复制粘贴功能

    1.下载clipboard.js cnpm install clipboard --save 2.引入,可以在mian.js中全局引入也可以在单个vue中引入 import Clipboard fro ...

  3. vue中点击空白处隐藏弹框(用指令优雅地实现)

    在写vue的项目的时候,弹框经常性出现,并要求点击弹框外面,关闭弹框,那么如何实现呢?且听我一一...不了,能实现效果就好 <template> <div> <div c ...

  4. 实例:vue中点击空白区域关闭某个div图层

    <template> <div class="search" ref="searchMain"> <el-input v-mode ...

  5. vue中点击屏幕其他区域关闭自定义div弹出框

    直接上代码: mounted: function () { let that = this; $(document).on('click', function (e) { let dom = $('. ...

  6. vue中点击复制粘贴功能 clipboard 移动端

    页面是由 v-for 循环渲染出来,要给每一个结构里面的复制按钮加一个复制功能 npm install clipboard --save    安装,如果安装处问题,多安装几次,我自己也安装了好几次 ...

  7. vue中点击按钮自动截图并下载图片

    点击一个按钮,截取对应区域的界面,才对截取的界面进行裁切并下载 下载    html2canvas    npm install html2canvas  --save 引用 : import htm ...

  8. vue中点击按钮复制内容

    <el-button type="primary" round size="mini" @click="copyUrl">复制u ...

  9. vue 点击当前元素添加class 去掉兄弟的class 获取当前点击元素的文字

    点击当前标签给其添加class,兄弟标签class删除 然后获取当前点击元素的文字 演示地址: https://xibushijie.github.io/static/addClass.html &l ...

随机推荐

  1. Socket for android 简单实例

    最近在实现socket通信,所以写个demo来简单实现下.我用了一种是原始的socket实现,另一种是MINA框架来实现的. 下载demo:http://download.csdn.net/detai ...

  2. Spring MVC基本配置和实践(一)

    一.Spring MVC介绍 1. Spring MVC是什么? The Spring Web MVC framework和Struts2都属于表现层的框架,它是Spring框架的一部分,我们可以从S ...

  3. pmp心得

    我报名比较晚,等缴费最后期限,才缴费,下定决心,开始正式的备考. 我的工作比较忙,备考时间特比较短,从拿到书到考试只有二个月了,心理慌慌的,期间还有一门其他的考试,在5月底,实际时间只能有20来天. ...

  4. 初识WCF3

    http://www.cnblogs.com/xiangchangdong/p/3924030.html 第三篇 在IIS中寄宿服务 通过前两篇的学习,我们了解了如何搭建一个最简单的WCF通信模型,包 ...

  5. 关于用GetManifestResourceNames读不出资源文件的解决

    在写程序时,需要读出所有资源的图片文件,程序工作正常, Assembly asm = Assembly.GetExecutingAssembly();string[] resourceNames = ...

  6. 乘风破浪:LeetCode真题_015_3Sum

    乘风破浪:LeetCode真题_015_3Sum 一.前言 关于集合的操作,也是编程最容易考试的问题,比如求集和中的3个元素使得它们的和为0,并且要求不重复出现,这样的问题该怎么样解决呢? 二.3Su ...

  7. December 21st 2016 Week 52nd Wednesday

    Keep conscience clear, then never fear. 问心无愧,永不畏惧. I find it is very difficult for me to keep consci ...

  8. PhoneGap获取设备信息

    一. 获取设备信息的方法列表(如果没有或者检测不出来就显示undefined) 1.device.name              设备名称(一些国产机检测不出来) 2.device.model   ...

  9. hql语句中的分页显示

    public List<User> getUserList(int pageInfo) { DBUtil dbutil = new DBUtil(); Session session = ...

  10. C++中在子类实现父类的方法调用