jQuery获取点击对象的父级
一、使用$('body').on('click','.index',function(event){})绑定事件时,例:
<div class="project-box">
<a href="javascript:void(0)">
<div class="clearfix">
<p>项目名称:</p>
<p class="p-name">超级玛丽 for andriod</p>
</div>
<div class="clearfix">
<p>项目类型:</p>
<p class="p-type">游戏开发</p>
</div>
<div class="clearfix">
<p>项目人员:</p>
<p class="p-people">andriod开发工程师 UI设计师</p>
</div>
<div class="clearfix">
<p class="pro-time">2017-6-15</p>
</div>
<div class="join-pro">
<button class="join" type="text">点击参与</button>
</div>
</a>
</div>
点击class = "join"获取class="project-box"下的class="p-name":
$('body').on('click','.index',function(event){
var target = event.target;
if(target.className === 'join'){
let projectName = $(target).parents(".project-box").find(".p-name").html();
console.log(projectName);
}
});
二、常规方法获取点击对象的父元素
<div class="col-xs-12 col-sm-6 col-md-3 project-box">
<a href="javascript:void(0)">
<div class="clearfix">
<p>项目名称:</p>
<p class="p-name">超级玛丽 for andriod</p>
</div>
<div class="clearfix">
<p>项目类型:</p>
<p class="p-type">游戏开发</p>
</div>
<div class="clearfix">
<p>项目人员:</p>
<p class="p-people">andriod开发工程师 UI设计师</p>
</div>
<div class="clearfix">
<p class="pro-time">2017-6-15</p>
</div>
<div class="join-pro">
<button class="join" type="text">点击参与</button>
</div>
</a>
</div>
点击class = "join"获取class="project-box"下的class="p-name":
$(".join).onclick = function(){
$(this).parent().parent().parent().toggle();
}
jQuery获取点击对象的父级的更多相关文章
- JS和jQuery获取节点的兄弟,父级,子级元素
原文转自http://blog.csdn.net/duanshuyong/article/details/7562423 先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的 ...
- WPF利用VisualTreeHelper遍历寻找对象的子级对象或者父级对象
原文:WPF利用VisualTreeHelper遍历寻找对象的子级对象或者父级对象 简介 本文将完整叙述我利用VisualTreeHelper实现题述功能的全部过程,想直接看函数实现的朋友可以跳到函数 ...
- JS - 点击事件排除父级标签
点击事件排除父级标签,这里使用的是stopPropagation()方法.event.stopPropagation(); 对了,这里还用了解除click事件,unbind. 下面这篇博文,介绍挺全的 ...
- 使用jquery刷新当前页面、刷新父级页面
如何使用jquery刷新当前页面 下面介绍全页面刷新方法:有时候可能会用到 window.location.reload(); //刷新当前页面.(我用的这个一个,非常好) parent.locati ...
- 【震惊】padding-top的百分比值参考对象竟是父级元素的宽度
引言 书写页面样式与布局是前端工程师Coding 中必不可少的一项工作,在定义页面元素的样式时,padding 属性也是经常被使用到的. padding 属性用于设置元素的内边距,其值可以是lengt ...
- jq点击元素删除父级
首先要能找到父级:需要操作的dom结构如下: <tbody> <tr> <td>星期一早起</td> <td class="status ...
- JS获取节点的兄弟,父级,子级元素
https://blog.csdn.net/duanshuyong/article/details/7562423 先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作 ...
- jquery获取点击控件的绝对位置简单实例
在使用jquery的过程中,想取得当前点击input的绝对位置而去显示一个div,jquery本身提供offset和position这个两个方法,但position官方解释是relative to t ...
- 锋利的jQuery-2--判断jQuery获取到的对象是否存在$().length
1.使用js获取不存在的对象: document.getElementById("tt").style.color = "red"; 如果网页中不存在id = ...
随机推荐
- 【每日dp】 Gym - 101889E Enigma 数位dp 记忆化搜索
题意:给你一个长度为1000的串以及一个数n 让你将串中的‘?’填上数字 使得该串是n的倍数而且最小(没有前导零) 题解:dp,令dp[len][mod]为是否出现过 填到第len位,余数为mod 的 ...
- Django:模型model和数据库mysql(一)
以一个栗子尝试来记录: 两个表存储在数据库中,BookInfo表示书,HeroInfo表示人物.一本书中有多个人物 在MySQL中新建一个数据库Django1,不用创建表,用Django模型来配置数据 ...
- express 写一个简单的web app
之前写过一个简单的web app, 能够完成注册登录,展示列表,CURD 但是版本好像旧了,今天想写一个简单的API 供移动端调用 1.下载最新的node https://nodejs.org/zh- ...
- hash_map
点开一道第是自己oj的第440大关,想a了,一直想却无果,学长一句点醒,开始写hash. 关于这道题呢很无语了,两天卡在这上面,而且有些dalao不到20min就a了.我太菜了. 所以要深入讨论这道题 ...
- 转:HashMap实现原理分析(面试问题:两个hashcode相同 的对象怎么存入hashmap的)
原文地址:https://www.cnblogs.com/faunjoe88/p/7992319.html 主要内容: 1)put 疑问:如果两个key通过hash%Entry[].length得 ...
- 20165317JAVA实验二-面向对象程序设计
JAVA实验二-面向对象程序设计 提交点一 参考Intellj IDEA 简易教程-单元测试完成单元测试的学习 在IDEA中建立名为MyUtil5317的project,并在其src文件夹中创建名为M ...
- 获取文件后缀名(zip,rar等)
var filename = file.name; var index1 = filename.lastIndexOf("."); var index2 = filename.le ...
- bzoj 2563 [2012国家集训队Round 1 day2] 阿狸和桃子的游戏 贪心
正解:贪心 解题报告: 链接在这儿! 知道解法之后会jio的好像很简单的样子……其实挺难想到的QAQ 不过大佬讲了方法之后还是懂了 有一个很神仙的想法就是,你可以理解为每个点周围的边都有半个是自己的, ...
- Redis 安装、配置、集群
1. Redis的安装 1.1. Redis的安装 Redis是c语言开发的. 安装redis需要c语言的编译环境.如果没有gcc需要在线安装.yum install gcc-c++ 安装步骤: ...
- numpy的searchsorted细品
import numpy as np a= np.arange(20) pos_left = a.searchsorted(3) #也可以写成np.searchsorted(a, 3), 注 ...