奇怪点击创建不同的功能甚至点击链接

Question

I have 3 links which are the names of students.On clicking a link first time or odd number time,another div which contains the details of that student appears.On clicking the same link on second time or even number time, I need to hide the student div.Its working perfectly for me using data() event of jquery.

My requirement is if I click first student link,div with the details of first student will come.If I click the second student link,details of second student will come.If I again click on first link,the student div will hide since data() is associated with it(I think so). But I want to make it displayed because,previous click was on the second link.

My html is like this

<a href="" id="24" class="student_link">George</a>

<a href="" id="25" class="student_link">Leo</a>

<a href="" id="26" class="student_link">Kelm</a>

My jquery:

$("#sections ").on('click','.student_link',function(){
       var clicks = $(this).data('clicks');
      //alert(clicks);
      if (clicks) {
         $("#div_students").hide();
         //alert(1); 
      }
      else
      {
         $("#div_students").show();
         //alert(2);
      }

      $(this).data("clicks", !clicks);
      return false;
   });

That is if I click George for first time, the corresponding div of student will appear,If I click Leo without clicking George to hide the div,I need div of Leo should come.If I click George again,I need div with details of George should come.But for me the div is hiding since the variable click is already true for George.I need the div to be displayed if previous click was not on the current link.

Answer 1

You can use the following code:

$("#sections").on('click', '.student_link', function () {
    var prevClickedId = $('#sections').data('prevId');

    if (prevClickedId != $(this).attr('id')) {
        // This was not the previous clicked element
    } else {
        // This was the previous clicked element
    }

    $('#sections').data('prevId', $(this).attr('id'));
    return false;
});