如何通過使用ajax在同一行上單擊另一個值來更改表的特定行的值

Question

我試圖通過單擊第3個 td值來更改行的最后一個表值。 但是，當我單擊任何表行的第3個 td時，它只會更改第一行的最后一個td值。

$(document).ready(function(){ 
  $('.selectslots').change(function(){ 
    var myselectslots=$(this).val(); 
    var rowrate = $(this).closest('tr').find('td:last').text(); 
    $(this).attr('value', rowrate); console.log("clicked on the slot"); 
    console.log(rowrate); //The selectslots class is a class for the values of the third column. 

    $.ajax({
            url:'http://127.0.0.1/sufee/slotpurchase.php',
            method:'POST',
            data:{
                        myselectslots:myselectslots},
                        success:function(data){
                        //alert(data);
                        console.log(myselectslots);

                    if (myselectslots==30){
                        $('tr td:eq(5)').html('90');
                    }
                    else{
                        $('tr td:eq(5)').html(80);

                    } 

                }
            });
      });

我的期望是：如果我單擊特定行的列上的值，則該行的最后一個值應更改。 現在的問題是，無論我單擊哪個行，只有第一行的最后一個值都會更改。 請幫忙。

Answer 1

您可以在ajax調用之前將行保存在變量中，以在成功回調中使用它

$(document).ready(function(){ 
  $('.selectslots').change(function(){ 
    var myselectslots=$(this).val(); 
    var row = $(this).closest('tr')
    var rowrate = row.find('td:last').text(); 
    $(this).attr('value', rowrate); console.log("clicked on the slot"); 


    $.ajax({
            url:'http://127.0.0.1/sufee/slotpurchase.php',
            method:'POST',
            data:{
                        myselectslots:myselectslots},
                        success:function(data){
                        //alert(data);
                        console.log(myselectslots);

                    if (myselectslots==30){
                        row.find('td:eq(5)').html('90');
                    }
                    else{
                       row.find('td:eq(5)').html(80);

                    } 

                }
            });
      });