删除所有行，但显示被点击指定编号

Question

我想显示结果，当用户点击一行然后我会采取此ID并提取相关数据，并显示在下面。

Student Id Total Marks  Position View 
41   525    1  Marks Sheet 
42   504    2  Marks Sheet 
43   504    2  Marks Sheet 
44   504    2  Marks Sheet 
45   504    2  Marks Sheet 

假设用户点击列41，那么结果将显示在下面41，在此之后，当用户点击42则结果将低于42显示与先前的结果是在低于41，就可以隐藏/去掉。

我已经试了好几次，但我无法显示，我的代码只显示first.Like作为

Student Id Total Marks  Position View 
41   525    1  Marks Sheet 
Your marks sheet of student id:41 
42   504    2  Marks Sheet 
43   504    2  Marks Sheet 
44   504    2  Marks Sheet 
45   504    2  Marks Sheet 

当用户点击一行44则

Student Id Total Marks  Position View 
41   525    1  Marks Sheet 
42   504    2  Marks Sheet 
43   504    2  Marks Sheet 
44   504    2  Marks Sheet 
Your marks sheet of student id:44 
45   504    2  Marks Sheet 

我的JS代码：

$(function(){ 
    $('.student').click(function(){ 
    var sid = this.id; 
    $('.marks').not('#'+sid).remove(); 
    $('.marks').html("Your marks sheet of student id:"+sid);//Next,I will add user clicked studnt marks sheet from database. 
    }); 
    }); 

PHP和HTML代码：

echo '<tbody>'; 
    foreach($results as $user){ 
     echo '<tr><td>'. $user->stdId.'</td><td>'.$user->total_Marks.'</td><td>'.$user->position.'</td><td class="student" id='.$user->stdId.'>Marks Sheet</td></tr>'; 
    echo '<tr class="marks" id='.$user->stdId.'></tr>'; 
    } 
echo '<tr><tr></tbody>'; 

Answer 1

你得到的div与class="student"（返回所有的div带class =“学生”）的ID，但它应该是已经被点击当前元素的id 。
此外，您对学生和标记元素都使用相同的ID，因此需要更改标记元素ID，如marks_ {studentId}（请参见下文）;

'<tr class="marks" id="marks_'.$user->stdId.'"></tr>'; 

，并使用下面的代码

$(function(){ 
     $('.student').click(function(){ 
     var sid = this.id; 
        ^------^// changed this 
     $('.marks').html('');// remove all mark messages 
     $('#marks_'+sid).html("<td colspan='4'>Yes that is ok."+sid+"</td>"); 
     }); 
    }); 

而且，如果你不希望改变标记元素的id，然后使用下面的代码，但在这里纪念行必须是下一行给学生排

$(function(){ 
     $('.student').click(function(){ 
      var sid = $(this).attr('id'); 

     $('.marks').html('')// remove all mark messages 

     $(this).parent().next().html("<td colspan='4'>Yes that is ok."+sid+"</td>"); 

     }); 
    }); 

这里是工作JSFiddle

Answer 2

这里是新的代码。使用“this”关键字来获取数据（ID）

$(function(){ 
    $('tr').click(function(){ 
    var sid = $(this).attr('id'); 
    $('.marks').not('#'+sid).remove(); 
    $('.marks').html("Yes that is ok."+sid); 
    }); 
    });