我正在尝试alert，但是单击功能是第一个按钮上的running only once。但我有buttons on many rows。

我正在通过Laravel从表中的数据库中获取数据。只有一个按钮可以运行一项功能，其他按钮则什么也没有。

jQuery：

jQuery(document).ready(function(e)  {
    $('#restore-data').on('click',function(e) {
    var val = $("#thisr").attr('value');
    alert(val);

    });
});

查看：

<table id="recover-table" class="table" >
    <thead>
    <tr class="bg-info">
        <th>Teacher Name</th>
        <th>Date</th>
        <th>action</th>
    </tr>
    </thead>
    <tbody>

    @foreach($trashs as $trash)

    <tr id="thisr" value="{{$trash->id}}">
    <td class="text-nowrap ">{{$trash->efirst}} {{$trash->esecond}}</td>

    <td class="text-nowrap ">{{$trash->deleted_at}}</td>

    <td class="text-nowrap "><button type="submit"  class="" name="id" 
    value="{{$trash->id}}" id="restore-data">Delete</button></td>

    </tr>

    @endforeach </tbody></table>

现在，即使警报也无法正常工作，但我想在从表中删除记录后实现刷新表。

更新：现在，警报工作正常，但是当我通过按下按钮删除记录时，仅删除了一行。该功能运行一次。

完整的Js：

jQuery(document).ready(function(e)  {

    $('#restore-data').on('click',function(e) {

    let teacher_id=$(this).attr('value');
    console.log('Restore button clicked!')
    e.preventDefault();

    $.ajax(
    {
      url: "/teachers/recover/" + $('#restore-data').attr("value"),type: 'GET',// Just delete Latter Capital Is Working Fine
      headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },data: teacher_id,success: function (data) {
     console.log(data.msg);
     console.log(teacher_id);

     if(data.msg){
         $('#thisr').remove();
         $('#response').empty();
         $(".toast").toast('show');
         $('#response').append(data.msg);
      }
    },error: function (xhr) {
    console.log("Error Restoring Record");
    //console.log(xhr.responseText);
    },});
  });
});