<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. 文心一言 VS 讯飞星火 VS chatgpt (155)-- 算法导论12.3 2题

    二.用go语言,假设通过反复向一棵树中插人互不相同的关键字来构造一棵二叉搜索树.证明:在这棵树中查找关键字所检查过的结点数目等于先前插入这个关键字所检查的结点数目加 1. 文心一言: 为了证明这个结论 ...

  2. Celery周期性任务定义beat

    通过celery beat可以使用周期性任务的定义. https://docs.celeryq.dev/en/stable/userguide/periodic-tasks.html 周期性任务bea ...

  3. grpc是基于http/2协议的高性能的rpc框架

    师傅领进门,修行在个人,跟着官方脚手架demo了grpc后,之后就需要扩展前后知识边界,下面总结grpc的前世今生和最佳实践. https://www.cnblogs.com/JulianHuang/ ...

  4. 从零玩转七牛云之CDN-qiniuyunzhicdn

    title: 从零玩转七牛云之CDN date: 2022-03-27 19:14:43.036 updated: 2022-04-10 14:13:27.322 url: https://www.y ...

  5. cs上线Linux

    cs上线Linux 下载和配置crossC2 首先到项目地址:https://github.com/gloxec/CrossC2/releases下载两个文件 后缀为.cna的为cs的插件文件,启动c ...

  6. Python——第二章:元组

    元组 tuple 使用小括号组成 特点: 元组是不可变的,固定了某些数据. t = ("张无忌", "赵敏", "呵呵哒") print(t ...

  7. SQL语句(mysql)「一」

    SQL的一些常用语句 创建类 CREAT DATABASE <数据库名>; 该方法创建一个数据库,当要使用一个数据库的时候,使用指令: USE <数据库名>; 查看当前正在使用 ...

  8. Bean named ‘xxxxxx‘ is expected to be of type ‘x‘ but was actually of type ‘com.sun.proxy.$Proxy112‘

    Bean named 'instanceService' is expected to be of type 'awb.operations.service.instance.InstanceServ ...

  9. 十八般武艺玩转GaussDB(DWS)性能调优(二):坏味道SQL识别

    摘要:那些会导致执行效率低下的SQL语句及其执行方式,我们称之为SQL中的"坏味道". ◆ 什么是SQL中的坏味道 SQL语言是关系型数据库(RDB)的标准语言,其作用是将使用者的 ...

  10. 华为云API中心:汇聚千行百业API资产,打造API全生命周期极致体验

    摘要:2022年11月9日,华为云全球生态部总裁康宁在华为全联接大会2022上发表"共创新价值,一切皆服务"主题演讲,并发布全新的华为云API中心. 本文分享自华为云社区<华 ...