zoukankan      html  css  js  c++  java
  • 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();
    }
    

      

  • 相关阅读:
    零基础入门深度学习(1)
    RxJava 复杂场景 Schedulers调度
    Kotlin 学习
    Cordova CrossWalk
    Android Studio工程导入另一个工程作为lib
    Android 数据存储相关
    Android Activity 生命周期中onStart()和onResume()的区别
    反省与规划
    Android 依赖注入 ButterKnife 基本使用
    Android Socket 相关
  • 原文地址:https://www.cnblogs.com/detanx/p/jQuery_ClickGetParentNode.html
Copyright © 2011-2022 走看看