<div
class="account-item"
v-for="item in accountList"
:key="item.id"
:class="[
{ 'is-select-mode': isSelectMode },
{ 'is-select': item.isSelect }
]"
@click="selectItemClick(item)"
>
<el-checkbox
v-if="isSelectMode"
v-model="item.isSelect"
label=""
size="large"
@click.stop="stopEvent"
/>
<svg-icon class="svg-icon" icon="icon-custom"></svg-icon>
<div class="account-content">
<div class="name">{{ item.name }}</div>
<div class="phone">{{ item.phone }}</div>
<div class="email">{{ item.email }}</div>
<div class="address">{{ item.address }}</div>
</div>
</div>

点击div时,点击div取消,勾选复选框是正常的,但是点击复选框却失效,这是由于冒泡,相当于改了两次checked的值,造成值没变,只需要给checkbox的点击事件取消冒泡就可以了。

记一次el-checkbox包裹一层div,点击div勾选复选框,点击复选框却没反应的bug的更多相关文章

  1. checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中

     checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中 <!DOCTYPE html> <html lang=" ...

  2. 全选或者单选checkbox的值动态添加到div

    图片.png <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> < ...

  3. css 父div如何包裹带有float属性的子div,float子div如何撑开父div

    来自网络摘抄 原始代码 <style> #div1{border:1px solid red;float:left;} #div2,#div3{float:right;border:1px ...

  4. JaveWeb 公司项目(2)----- 类模态窗口显示DIV并将DIV放置在屏幕正中间

    上一篇博客写的是通过隐藏显示进行div的替换,接下来需要在原有的div前添加一个div,进行表单的提交,需要将div放置在正中间,然后类似C#中的模态窗口,在进行完新弹出的div操作之后,才可以进行下 ...

  5. jQuery实现复选框的全选、反选、并且根据复选框的<checked属性>控制多个对应div的显示/隐藏

    <!doctype html><html> <head> <meta charset="utf-8"> <title>j ...

  6. 点击div 跳转并通过URL传参

    点击div前要先给div绑定要传的参数: //给panel绑定自定义属性,方便在跳转时传带参数,键/值对排列 panel.attr("user_age",user_age); pa ...

  7. 如何禁用事件的浮升(div的子元素的点击事件会触发父元素的点击事件)

    <div onclick="alert();"> <div onclick="alert();"></div> </d ...

  8. 点击div折叠

    <!doctype html> <html> <head> <meta charset="utf-8"> <meta cont ...

  9. 点击div全选中再点击取消全选div里面的文字

    想做一个就是点击一个div然后实现的功能是div里面的文字都成选中状态,然后就可以利用浏览器的自带的复制功能,任意复制在哪里去了 在网上百度了一下 然后网上的答案感觉很大的范围 然后一些搜索 然后就锁 ...

  10. $('div a') 与$('div>a'),.div+.div2与.div~.div2

    $('div a'):div标签下所有层次a元素的jquery对象 $('div>a'):div标签下子元素层次a元素的jquery对象 <body> <div class=' ...

随机推荐

  1. kotlin+springboot入门级别教程,教你如何用kotlin和springboot搭建http

    先打开idea,或者用springboot官网.阿里云那边都行 然后点击新建项目,spring Initializr,我们都知道,springboot是支持kotlin的,除非你是kotlin1.3之 ...

  2. KR4-KP4

    serdes测试中经常遇到KR4 和KP4, KR4指的是FEC 528 514对应25X4的100G KP4对应FEC 544 514,56/100x4 的200/400G链路 KP4应用比较广泛, ...

  3. 国产 Web 组态软件在玻璃生产线中的应用

    ​  概述 随着工厂信息化.数字化发展,智慧生产车间成为必然发展趋势,通过智能硬件.物联网.大数据等智慧化技术与手段,提高车间生产设备.工艺设备的智能执行能力,从而提升整个车间乃至工厂的智能化.网络化 ...

  4. vivo 容器平台资源运营实践

    作者:vivo 互联网服务器团队 - Chen Han 容器平台针对业务资源申请值偏大的运营问题,通过静态超卖和动态超卖两种技术方案,使业务资源申请值趋于合理化,提高平台资源装箱率和资源利用率. 一. ...

  5. 安装华企盾DSC防泄密软件:编辑文件不加密常见问题,运维工程师必看

    1.先查看客户端日志主进程是否是加密进程.日志中是不是勾选智能半透明.加密类型是否有添加 2.用procmon监控保存的文件找出writefile的进程是否有添加,进程树是否有父进程,加密类型是否正确 ...

  6. ACTF flutter逆向学习

    参考了许多大佬的博客,在此特别诚挚感谢oacia大佬和其他大佬的博客和指导! 1.flutter和apk基础结构介绍 首先下载附件,是一个apk文件,用jadx打开 可以看见flutter字样,而fl ...

  7. elastic常用api

    elasticsearch运维常用API 查看集群状态 查询集群状态命令: curl -XGET "http://ip:port/_cluster/health?pretty" # ...

  8. electron入门之配置镜像加速(四)

    electron入门到入土,配置阿里镜像加速.为了防止后面我们打包龟速,需要给electron配置阿里镜像加速 在下面的文件内添加阿里镜像加速,你的文件位置不一定是这个 C:\Program File ...

  9. Programming Abstractions in C阅读笔记:p246-p247

    <Programming Abstractions in C>学习第68天,p246-p247总结,总计2页. 一.技术总结 本章通过"the game of nim(尼姆游戏) ...

  10. 在线编辑Word——插入内容控件

    内容控件是可添加和自定义的以在模板.窗体和文档中使用的单个控件.Word中支持添加多种类型的控件用于不同文档的设计需求.本文,将通过在线编辑的方式展示如何在Word中插入内容控件,这里使用的在线编辑器 ...