HTML表格数据在页面刷新后会消失答案

【问题标题】：HTML Table data will disappear after page refreshHTML表格数据在页面刷新后会消失
【发布时间】：2023-03-20 20:31:01
【问题描述】：

我正在使用 Web 服务从 MySQL 数据库中获取数据并将它们显示在 HTML 表中。它的工作数据将出现在表格中。但是当我重新加载页面时，表格数据会消失。我该如何解决？即使页面重新加载，我如何保持数据？

HTML

<body>
    <button id="btnSearch">Search</button>
    <table id="tab">

    </table>
</body>

还有下面的JS。

<script type="text/javascript">
    $("#btnSearch").click(function() 
    {
        $.getJSON("http://localhost:8080/Service/Rest/cart/get/cart",function(data)
        {
            var tb = $("#tab");
            $.each(data,function(i,value)
            {
                tb.append("<tr><td>Product Name: " + value.name + "</td><td>Price: " + value.price + "    </td><td>Description: " + value.description + "</td></tr>");
            });
        });
    });  
</script>

【问题讨论】：

标签： json ajax jsp jax-rs

【解决方案1】：

<script type="text/javascript">
   $( document ).ready(function() {
$.getJSON("http://localhost:8080/Service/Rest/cart/get/cart",function(data)
        {
            var tb = $("#tab");
            $.each(data,function(i,value)
            {
                tb.append("<tr><td>Product Name: " + value.name + "</td><td>Price: " + value.price + "    </td><td>Description: " + value.description + "</td></tr>");
            });
        });
});
 $("#btnSearch").click(function() 
    {
        $.getJSON("http://localhost:8080/Service/Rest/cart/get/cart",function(data)
        {
            var tb = $("#tab");
            $.each(data,function(i,value)
            {
                tb.append("<tr><td>Product Name: " + value.name + "</td><td>Price: " + value.price + "    </td><td>Description: " + value.description + "</td></tr>");
            });
        });
    });  
</script>

【讨论】：

【解决方案2】：

我对此有另一种解决方案，创建一个空值的虚拟表数据，并将您的值存储在浏览器会话中，然后通过 jquery/javascript 在运行时替换所有空值。

希望这会有所帮助。

【讨论】：