点击DIV触发其他元素的点击事件(案例:点击type="radio" 的input 标签外层DIV,触发内部单选点击选中事件)
方法一:
直接用找到对应dom元素调用.click()方法
$('.user_content').click(function(){
$(this).children()[0].click(); //Dom元素执行点击事件
//或者Dom元素执行点击事件
$(this).children('input[type="radio"]')[0].click();
}
方法二:
参考:https://blog.csdn.net/qq_37000055/article/details/101562653
html
<div class="tempStyle" @click="checked($event)">
<input class="hy-radio" type="radio" name="a"><label>选项1</label>
</div>
<div class="tempStyle" @click="checked($event)">
<input class="hy-radio" type="radio" name="a"><label>选项2</label>
</div>
对应js
method: {
checked(e) {e.currentTarget.firstElementChild.click();}
}
点击DIV触发其他元素的点击事件(案例:点击type="radio" 的input 标签外层DIV,触发内部单选点击选中事件)的更多相关文章
- div里面的元素垂直均匀分布 按钮引发地址栏出现问号 判断一个数组是否为空 div底部居中 路由传参接受参数
一个固定高度的div的子元素 在垂直 方向上平均分布 .important-dec{ height: 121px; flex-direction: column; display: flex; jus ...
- input标签内容改变触发的事件
原生方法 onchange事件 <input type="text" onchange="onc(this)"> function onc(data ...
- 如何禁用事件的浮升(div的子元素的点击事件会触发父元素的点击事件)
<div onclick="alert();"> <div onclick="alert();"></div> </d ...
- 纯CSS实现点击事件展现隐藏div菜单列表/元素切换
在写移动端导航的时候经常用到点击按钮出现/隐藏导航条的情况,最常见的方法当然还是前端框架直接调用,省心省力,不易出错:当然还有使用纯JS实现的小代码段.我这里整理了纯CSS实现方式,给需要的人和给自己 ...
- 【转载】设置event.cancelBubble,使触发子元素的onclick不同时触发父元素的onclick
由于HTML中的对象都是层次结构,比如一个Table包含了多个TR,一个TR包含了多个TD Bubble就是一个事件可以从子节点向父节点传递,比如鼠标点击了一个TD,当前的event.srcEleme ...
- JS子元素oumouseover触发父元素onmouseout
原文:JS子元素oumouseover触发父元素onmouseout JavaScript中,父元素包含子元素: 当父级设置onmouseover及onmouseout时,鼠标从父级移入子级,则触发父 ...
- jQuery实现点击控制左右两边元素挤压显示效果
该功能实现的是:分左.右两边布局,左边div默认展开,左边div中有一个元素,点击实现左边div隐藏,右边div挤压过来:再点击实现左边显示,右边挤过去. 一.HTML代码: <div clas ...
- div和span元素的区别
2个都是用来划分区间但是没有实际语义的标签,差别就在于div是块级元素,不会其他元素在同一行;span是内联元素,可以与其他元素位于同一行. DIV 和 SPAN 元素最大的特点是默认都没有对元素内的 ...
- 鼠标拖动改变DIV等网页元素的大小的最佳实践
1.初次实现 1.1 html代码 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" la ...
随机推荐
- .net core 和 WPF 开发升讯威在线客服系统:使用本地IP数据库实现访客来源快速定位,支持国外
本系列文章详细介绍使用 .net core 和 WPF 开发 升讯威在线客服与营销系统 的过程.本产品已经成熟稳定并投入商用. 免费使用 & 私有化部署:https://kf.shengxun ...
- 寒武纪加速平台(MLU200系列) 摸鱼指南(四)--- 边缘端实例程序分析
PS:要转载请注明出处,本人版权所有. PS: 这个只是基于<我自己>的理解, 如果和你的原则及想法相冲突,请谅解,勿喷. 前置说明 本文作为本人csdn blog的主站的备份.(Bl ...
- 我在组内的Java问题排查分享
前言 最近翻看以前写的 PPT, 发现了在2019年做的一次技术分享,关于 Java 问题排查,由于没什么公司机密可言,整理下分享给大家~ 线上问题处理流程 直接放PPT截图吧,现在看来依然不过时 问 ...
- R数据科学-2
R数据科学(R for Data Science) Part 2:数据处理 导入-->整理-->转换 ------------------第7章 使用tibble实现简单数据框------ ...
- python-django 使用class重写视图和模板变量
基于类的视图 c Django模板语法 两个模板引擎如何进行模板文件的查找 模板引擎都找不到的时候,就照模块里面的模板 一旦找到模板不会继续查找了 注意:img_addr是必须和视图里面的变量名字保持 ...
- EXCEL-排名前三名显示小红旗,后三名显示小黑旗
总结(用的WPS):第一步:用=IF(RANK(数值,引用范围) <=3,"小红旗",IF(RANK(数值,引用,1) <=3,"小黑旗",&quo ...
- 关于SQL中Union和Join的用法
转自帘卷西风的专栏(http://blog.csdn.net/ljxfblog) https://blog.csdn.net/ljxfblog/article/details/52066006 Uni ...
- 华为AppTouch携手全球运营商,助力开发者出海
内容来源:华为开发者大会2021 HMS Core 6 APP services技术论坛,主题演讲<华为AppTouch携手全球运营商,助力开发者出海>. 演讲嘉宾:华为消费者云服务App ...
- 学习java的第二十一天
一.今日收获 1.java完全学习手册第三章算法的3.2排序,比较了跟c语言排序上的不同 2.观看哔哩哔哩上的教学视频 二.今日问题 1.快速排序法的运行调试多次 2.哔哩哔哩教学视频的一些术语不太理 ...
- 『学了就忘』Linux文件系统管理 — 67、通过命令模式进行LVM分区
目录 1.物理卷管理 (1)准备硬盘或者分区 (2)建立物理卷 (3)查看物理卷 (3)删除物理卷 2.创建卷组 (1)建立卷组 (2)查看卷组 (3)增加卷组容量 (4)减小卷组容量 (5)删除卷组 ...