table列表操作问题?
在实现列表时，通过编辑，查看，删除对每个元素进行操作。
table内容如下
<table id="table" class="table" style="margin-top: 20px;">
<tr>
<td>文件名</td>
<td>文件路径</td>
<td>分类</td>
<td>大小</td>
<td>操作</td>
</tr>
<#list resources as resource>
<tr class="trnode" name="${resource.name}">
<td id="res_id" style="display: none">${resource.resource_id}</td>
<td id="name">${resource.name}</td>
<td>${resource.location}</td>
<td>${resource.creator}</td>
<td>${resource.size}</td>
<td>
<a href="#" class="edit" data-toggle="modal" data-target="#editModal">编辑</a>
<a href="#" class="detail" data-toggle="modal" data-target="#showModal">查看</a>
<a href="#" class="del" data-toggle="modal" data-target="#deleteModal">删除</a>
</td>
</tr>
</#list>
</table>脚本如下
<script>
$(document).ready(function(){
$('.del').click(function(){
alert("2222");
})
$('.edit').click(function(){
alert($('.trnode').attr('name'));
})
$('.detail').click(function(){
alert($('#res_id').text());
})
});
</script>问题是，为什么点击后显示的都是第一个元素的内容，
点击第二行元素的编辑，依然显示第一行的内容
