javascript - .id() 方法在 jQuery 选择器上失败

Question

尝试创建一个函数，使 div 根据其 ID 使用 jquery 向下滑动。尝试尽可能高效地完成它。

这是我到目前为止所拥有的:

$('.meet-the-team').on('click', function() {

               var member = $(this).id();
               var parts = member.split();
               var id = parts[parts.length - 1];

               $(".member-profile #profile" + id).slideDown();

             });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="pure-g meet-the-team">
  <div class="pure-u-1-4 meet-the-team-a" id="member-a">
A
  </div>
  <div class="pure-u-1-4 meet-the-team-b" id="member-a">
B
  </div>
  <div class="pure-u-1-4 meet-the-team-c" id="member-a">
C
  </div>
  <div class="pure-u-1-4 meet-the-team-d" id="member-a">
D
  </div>
</div>
<div class="pure-g member-profile member-profile-a" id="profile-a">
  <div class="pure-u-10-24 member-profile-left">
    <h1>Jordon McCord</h1>
    <h2>Designer/User Experience</h2> 
    <i class="fa fa-linkedin-square fa-6"></i>
  </div>
  <div class="pure-u-14-24  member-profile-right">
    <p>Jordan is a User Interface and User Experience Designer with over 8 years of experience working on a range of exciting projects utilising his key skills in design and front end web development. Jordan is passionate about design and user interactions
      and in his spare time, he really enjoys writing about himself in the third person.</p>
  </div>
</div>
<div class="pure-g member-profile member-profile-b" id="profile-b">
  <div class="pure-u-10-24 member-profile-left">
    <h1>Adam McCord</h1>
    <h2>Designer/User Experience</h2> 
    <i class="fa fa-linkedin-square fa-6"></i>
  </div>
  <div class="pure-u-14-24  member-profile-right">
    <p>Jordan is a User Interface and User Experience Designer with over 8 years of experience working on a range of exciting projects utilising his key skills in design and front end web development. Jordan is passionate about design and user interactions
      and in his spare time, he really enjoys writing about himself in the third person.</p>
  </div>
</div>

为什么这不起作用？

提前感谢大家的帮助。

Answer 1

$('.meet-the-team div').on('click', function() {
    var member = $(this).attr('id');
    var parts = member.split('-');
    var id = parts[parts.length - 1];

    $(".member-profile-" + id).slideDown();
});

这应该有效。您还可以使用 $("#profile-"+ id).slideDown(); 而不是 $(".member-profile-"+ id).slideDown();.