资讯专栏INFORMATION COLUMN

单击 label 触发 checkbox,checkbox 触发 click

Forelax / 2099人阅读

摘要:在桌面程序中,后面是带文字的,单击文字就会选中或取消选中选择框,点起来很方便,但中是干的,单起来非得把鼠标移到那个小小的框框上。令人欣喜的是,点跟点一样,都会触发的事件,这就方便了我们编程。新认识,新收货。

在桌面程序中,checkbox 后面是带文字的,单击文字就会选中或取消选中选择框,点起来很方便,但 HTML 中 checkbox 是干的,单起来非得把鼠标移到那个小小的 checkbox 框框上。

要想实现桌面程序的效果,可增加一个控件 label。




如上代码,点 label 的文字,前面的 checkbox 就会被选中,再点击就会被取消。

令人欣喜的是,点 label 跟点 checkbox 一样,都会触发 checkbox 的 click 事件,这就方便了我们 DOM 编程。

之前没有认识到label for这个功能是跟checkbox默认绑定关联的,以为还需要自己绑定点击事件呢,其实根本不需要的。

新认识,新收货。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/105261.html

相关文章

  • C/C++ Qt 基础通用组件应用

    摘要:该组件有两个版本,用于显示整数与单精度浮点数,则是双精度浮点数,有两个特殊参数,参数是在前方加入特殊符号,而则是在后方加入特殊符号。QT 是一个跨平台C++图形界面开发库,利用QT可以快速开发跨平台窗体应用程序,在QT中我们可以通过拖拽的方式将不同组件放到指定的位置,实现图形化开发极大的方便了开发效率。目前,QT开发中常用的基础组件有以下几种:PushButton 按钮组件LineEdit ...

    YPHP 评论0 收藏0
  • 解析vue表单验证rules及validator验证器的使用方法

      很多知识都是需要提早知道,才可以规避很多错误。  Element中Form (表单)组件提供了表单验证的功能,只需要通过 rules 属性传入约定的验证规则,并将 Form-Item 的 prop 属性设置为需校验的字段名即可。  注意:prop对应表单域 model 字段,使用 validate方法时,该属性是必填的。  表单验证rules  以官网给出的例子分析来看  将prop属性设置为...

    3403771864 评论0 收藏0
  • vue封装element-ui的table组件,灵活配置表头实现表格内编辑,按钮,链接等功能。

    摘要:一封装的组件定义表格高度全屏增加前台分页功能。表格内编辑后,自动选中该行。单元格内数据样式单元格内按钮,可多个。触发组件绑定函数,参数按钮名称,按钮样式,按钮事件标识。单元格是否可点击的判断函数,可进行复杂的函数判断。 vue-bxz-table 一、封装element-ui的table组件: 定义表格高度全屏 增加前台分页功能。 自定义表头,循环输出整体表结构。 表格内编辑(输入框...

    henry14 评论0 收藏0
  • 使用断点调试代码

    摘要:在开发中,打断点是经常使用的调试代码的方法,现在在这里简略的翻译一下官方对此功能的讲解,并插入一些自己的说明。监测事件,在事件发生后暂停,断点到事件绑定的位置。 简单地说,断点调试是指自己在程序的某一行设置一个断点,调试时,程序运行到这一行就会停住,然后你可以一步一步往下调试,调试过程中可以看各个变量当前的值,出错的话,调试到出错的代码行即显示错误,停下。 在web开发中,打断点是经常...

    B0B0 评论0 收藏0

发表评论

0条评论

Forelax

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<