一、使用$('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获取点击对象的父级的更多相关文章

  1. JS和jQuery获取节点的兄弟,父级,子级元素

    原文转自http://blog.csdn.net/duanshuyong/article/details/7562423 先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的 ...

  2. WPF利用VisualTreeHelper遍历寻找对象的子级对象或者父级对象

    原文:WPF利用VisualTreeHelper遍历寻找对象的子级对象或者父级对象 简介 本文将完整叙述我利用VisualTreeHelper实现题述功能的全部过程,想直接看函数实现的朋友可以跳到函数 ...

  3. JS - 点击事件排除父级标签

    点击事件排除父级标签,这里使用的是stopPropagation()方法.event.stopPropagation(); 对了,这里还用了解除click事件,unbind. 下面这篇博文,介绍挺全的 ...

  4. 使用jquery刷新当前页面、刷新父级页面

    如何使用jquery刷新当前页面 下面介绍全页面刷新方法:有时候可能会用到 window.location.reload(); //刷新当前页面.(我用的这个一个,非常好) parent.locati ...

  5. 【震惊】padding-top的百分比值参考对象竟是父级元素的宽度

    引言 书写页面样式与布局是前端工程师Coding 中必不可少的一项工作,在定义页面元素的样式时,padding 属性也是经常被使用到的. padding 属性用于设置元素的内边距,其值可以是lengt ...

  6. jq点击元素删除父级

    首先要能找到父级:需要操作的dom结构如下: <tbody> <tr> <td>星期一早起</td> <td class="status ...

  7. JS获取节点的兄弟,父级,子级元素

    https://blog.csdn.net/duanshuyong/article/details/7562423 先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作 ...

  8. jquery获取点击控件的绝对位置简单实例

    在使用jquery的过程中,想取得当前点击input的绝对位置而去显示一个div,jquery本身提供offset和position这个两个方法,但position官方解释是relative to t ...

  9. 锋利的jQuery-2--判断jQuery获取到的对象是否存在$().length

    1.使用js获取不存在的对象: document.getElementById("tt").style.color = "red"; 如果网页中不存在id = ...

随机推荐

  1. dubbo-admin2.8.4部署

    1.环境准备 (1)操作系统:CentOS6.5 (2)安装JDK并且配置好环境变量,参考:http://blog.csdn.net/u013274055/article/details/739206 ...

  2. hdu-6415 Rikka with Nash Equilibrium dp计数题

    http://acm.hdu.edu.cn/showproblem.php?pid=6415 题意:将1~n*m填入一个n*m矩阵 问只有一个顶点的构造方案. 顶点的定义是:某数同时是本行本列的最大值 ...

  3. hive优化之并行执行任务

    1.与Oracle并行技术一样,hive在执行mapreduce作业时也可以执行并行查询.针对于不同业务场景SQL语句的执行情况,有些场景下SQL的执行是需要分割成几段去执行的,而且期间并不全是存在依 ...

  4. python--json串相关的loads dumps load dump

    #1 json串长的像字典,但不是字典类型,是str类型 #例如:user_info为json串,dict为字典,如果txt文本中标识dict的内容 为json串user_info = '''{&qu ...

  5. RabbitMQ 内存控制 硬盘控制

    RabbitMQ服务器在启动时以及abbitmqctl set_vm_memory_high_watermark fraction 执行时,会检查计算机的RAM总大小. 默认情况下下, 当 Rabbi ...

  6. 广播消费:允许一个 Group ID 所标识的所有 Consumer 都会各自消费某条消息一次。

    什么是消息队列 RocketMQ?_消息队列 RocketMQ-阿里云 https://help.aliyun.com/document_detail/29532.html 2019-01-30 16 ...

  7. composer命令详解

    composer命令行 你已经学会了如何使用命令行界面做一些事情.本章将向你介绍所有可用的命令. 为了从命令行获得帮助信息,请运行composer或者composer list 命令,然后结合--he ...

  8. iOS-方法之+ initialize 与 +load

    Objective-C 有两个神奇的方法:+load 和 +initialize,这两个方法在类被使用时会自动调用.但是两个方法的不同点会导致应用层面上性能的显著差异. 一.+ initialize ...

  9. 20165225《Java程序设计》第四周学习总结

    20165225<Java程序设计>第四周学习总结 1.视频与课本中的学习: 继承(extends) 重写 对象的上转型对象 super final instanceof运算符 abstr ...

  10. python之文件操作的几种模式总结

    文件操作的几种模式: "w"                             #write ,清空写,生成一个新的文件,写入内容,覆盖原文件"w+"  ...