一、使用$('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. JS弹出对话框的三种方式

    JS弹出对话框的三种方式 我们用到了alert()方法.prompt()方法.prompt()方法,都是在网页有一个弹出框,那么就让我们探究一下他们之间的区别: 一.第一种:alert()方法 < ...

  2. lame音频编码注意的点

    1.注意每次编码的PCM数据不能太短,如果太短编码函数长期返回-1这样的错误,将导致编码器彻底失效程序奔溃的问题,经测试32000在3200下稳定,大概1/10码率是没有问题的,具体请自行查询或调试 ...

  3. Linear transformations. 线性变换与矩阵的关系

    0.2.2 Linear transformations. Let U be an n-dimensional vector space and let V be an m-dimensional v ...

  4. [gdb][python][libpython] 使用gdb调试python脚本

    https://devguide.python.org/gdb/ https://sourceware.org/gdb/current/onlinedocs/gdb/Python.html#Pytho ...

  5. [X][xrandr][archlinux] 手动调整显示器分辨率

    有一些时候,电脑并不能正确的识别出显示器的最大分辨率,这有可能是软件的原因,硬件的原因,显示器的原因,VGA线的原因等其他原因. 我遇到的情况,是开机时候连着VGA的话,就可以正确识别.如果使用中间进 ...

  6. FlinkCEP - Complex event processing for Flink

    https://ci.apache.org/projects/flink/flink-docs-release-1.3/dev/libs/cep.html 首先目的是匹配pattern sequenc ...

  7. U3d 入门

    环境搭建: 1.安装exe; 2.破解 ,百度

  8. Mysql undo redo 总结

  9. C#查找字符串位置

    int i=zifuchuan.IndexOf(","); int n=(zifuchuan.SubString(i+1)).IndexOf(","); int ...

  10. 《mongoDB》基本操作-创建/更新/删除文档

    一:基本操作 - db; 当前选择的集合(等于数据库名) > db demo -  use db_name; 选择你要操作的集合 > use demo switched to db dem ...