如何通过使用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);

                    } 

                }
            });
      });