<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. .NET8顶级调试lldb观察FOH堆字符串分配

    前言 好久没有动用LLDB了,这种未来的下一代高性能调试器应该是用在Linux内核系统的Arm64/Riscv64/X64系统指令集上的,LLDB Debug .NET有点杀鸡用牛刀.本篇通过它来看下 ...

  2. scroll-view和swiper的使用

    源码: <template>            <viex class="out">            <view class="b ...

  3. HBase的实验原理

    功能组件: master Region Region到底被存到哪里去了 HBase的三层结构 三层结构中各个层次的名称和作用

  4. 推荐给前端开发的 5 款 Chrome 扩展 🚀

    大家好,我是 dom 哥.这是我关于 Chrome 扩展开发的系列文章,感兴趣的可以 点个小星星. 工欲善其事,必先利其器.Chrome 可能是前端开发中使用最多的浏览器.在日常开发中,下列几款 Ch ...

  5. jextract的使用

    写这个博客的目的:新人去看jextract的官网是看不懂的,就算看懂了也不会使用,一头雾水,我会从0开始教如何使用,如何搭配java去调用c函数. 首先我们得了解jextract是什么,官网的解释是一 ...

  6. 华企盾DSC控制台操作卡顿如何解决

    解决方法: 修改注册表: HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows NT\CurrentVersion\Windows 的 USERProcessHa ...

  7. MinIO客户端之ping

    MinIO提供了一个命令行程序mc用于协助用户完成日常的维护.管理类工作. 官方资料 mc ping 检查指定的MinIO节点的服务是否可用. 不带参数,命令如下: ./mc ping local1 ...

  8. 从零玩转设计模式之建造者模式-jianzaozhemoshi

    title: 从零玩转设计模式之建造者模式 date: 2022-12-08 18:15:30.898 updated: 2022-12-23 15:35:58.428 url: https://ww ...

  9. 春眠不觉晓,Java数据类型知多少?基础牢不牢看完本文就有数了

    文编|JavaBuild 哈喽,大家好呀!我是JavaBuild,以后可以喊我鸟哥!俺滴座右铭是不在沉默中爆发,就在沉默中灭亡,一起加油学习,珍惜现在来之不易的学习时光吧,等工作之后,你就会发现,想学 ...

  10. 为什么匿名内部类可以实例化并实现抽象方法?lambda表达式是简化了匿名内部类的实现过程吗?

    为什么匿名内部类可以实例化并实现抽象方法? 在Java中,接口是一种特殊的抽象类型,它只定义了一个或多个抽象方法.接口不能被实例化,但是我们可以使用匿名内部类来实现接口并创建一个具体的对象. 匿名内部 ...