javascript - 使用ajax如何在不刷新页面的情况下显示特定td的值

Question

我正在使用内联编辑来编辑 td，编辑后我正在使用编辑后的值进行一些计算，并且我在特定的 td 中显示该计算值而不刷新页面，我的问题是如果我正在使用编辑后的值进行两次计算我想显示不同 td 中的计算值，但我无法显示，因为现在它最后显示两个 td 中的计算值。我想显示不同 td 中的计算值任何人都可以指导我如何做到这一点

java脚本:

<script>    
    $(document).ready(function(){               
        $('td.edit').click(function(e){                              

                                                    success: function(data){
                                                        $('#CPH_GridView1_supplier_total_cost'+arr[2]).empty();
                                                        $('#CPH_GridView1_supplier_total_cost'+arr[2]).append(data);
                                                        $('#clienttotalprice'+arr[2]).empty();
                                                        $('#clienttotalprice'+arr[2]).append(data);
                                                         $('.ajax').html($('.ajax input').val());
                                                         $('.ajax').removeClass('ajax');
                                                    }});                                         }                                    
                                  }
                         );



    });
</script>

html

<td id="CPH_GridView1_supplier_total_cost'.$rows['id'].'" style="width:182px" class="edit supplier_total_cost '.$rows["id"].'">'.$rows["supplier_total_cost"].'</td>
<td id="clienttotalprice'.$rows['id'].'" style="width:217px" class="edit clienttotalprice '.$rows["id"].'">'.$rows["clienttotalprice"].'</td>   

updatedetailed.php

<?php
        print $suppliertotalcost;
        print $clienttotalprice;



?>

Answer 1

您使用了两次 print 语句，当它返回到 AJAX 调用时，它被视为一份数据。

改为这样做。 updatedetailed.php 末尾:

$result=array();
$result['suppliertotalcost']=$suppliertotalcost;
$result['clienttotalprice']=$clienttotalprice;
echo json_encode($result);

在您的 AJAX 调用中:

$.ajax({    type: "POST",
            url:"updatedetailed.php",
            data: "value="+$('.ajax input').val()+"&rowid="+arr[2]+"&field="+arr[1],
            success: function(res){
                data = jQuery.parseJSON(res); //added line
                $('#CPH_GridView1_supplier_total_cost'+arr[2]).empty();
                $('#CPH_GridView1_supplier_total_cost'+arr[2]).append(data.suppliertotalcost); //changed
                $('#clienttotalprice'+arr[2]).empty();
                $('#clienttotalprice'+arr[2]).append(data.clienttotalprice); //changed
                 $('.ajax').html($('.ajax input').val());
                 $('.ajax').removeClass('ajax');
            }});