如何使用 html5 webstorage 保存页面？答案

【问题标题】：How to save a page with html5 webstorage?如何使用 html5 webstorage 保存页面？
【发布时间】：2012-11-09 11:11:56
【问题描述】：

我有以下页面，它适用于 MySQL、PHP 和 AJAX 如果我单击 NAME (id="orderN")，它会给我返回咨询的结果，它对名称进行降序或升序排序。如果您刷新（F5）页面，有什么方法可以将结果保存为关闭之前的状态（ASC 或 DESC）？我听说过 cookie 和 HTML5 Storage，这比 cookie 更好。如果您可以使用其中任何一个，请告诉我

<html>
<head>
    <script type="text/javascript" src="jquery-1.8.2.min.js"></script>
</head>
<body>
    <table>
        <tr><th><a href="#" id="orderN">Name</a></th></tr> 
    </table>
    <?
    $Conn = mysql_pconnect('localhost', 'root', '1234') or die('Error"');
    mysql_select_db('DATA');
    $consult = "SELECT NAME
            FROM STUDENTS";
    $query = mysql_query($consult);
    echo "<div id='DivConsult'><table>";
    while ($table = mysql_fetch_assoc($query)) {
        echo "<tr>";
        echo "<td>" . $table['NAME'] . "</td>";
        echo "</tr>  ";}
    echo "</table>";
    ?>
    <script>
        $(document).ready(function() {
            var contName = 0;
            $('#orderN').click(function() {
                contName++;
                if (contName % 2 !== 0) {
                    $.ajax({
                        type: "POST",
                        url: "reOrder.php",
                        data: "tipOrder=ASC",
                        success: function(data) {
                            $('#DivConsult').html(data);
                        }});
                }
                if (contName % 2 == 0) {
                    $.ajax({
                        type: "POST",
                        url: "reOrder.php",
                        data: "tipOrder=DESC",
                        success: function(data) {
                            //alert(data);
                            $('#DivConsult').html(data);
                        }});
                }
            });
        });
    </script>
</body>

AJAX：

<?php
$Conn = mysql_pconnect('localhost', 'root', '1234') or die('Error"');
mysql_select_db('DATA');

$consult = "";

if (isset($_POST['tipOrder'])) {

 if ($_POST['tipOrder'] == 'ASC') {
    $consult = "SELECT NOMBRE
            FROM STUDENTS ORDER BY NAME ASC";
}
if ($_POST['tipOrder'] == 'DESC') {
    $consult = "SELECT NAME
            FROM STUDENTS ORDER BY NAME DESC";
}}`
  $query = mysql_query($consult);

echo "<table>";

while ($table = mysql_fetch_assoc($query)) {
    echo "<tr>";
    echo "<td>" . $table['Name'] . "</td>";
    echo "</tr>  ";}

echo "</table>";

?>

【问题讨论】：

与论坛网站不同，我们不使用“谢谢”、“感谢任何帮助”或Stack Overflow 上的签名。请参阅“Should 'Hi', 'thanks,' taglines, and salutations be removed from posts?.

标签： php mysql ajax cookies

【解决方案1】：

您可以这样做，但只需将容器（任何 div、span 甚至正文）保存为

localStorage.variableName = document.getElementById("id");

然后你就可以使用访问了

if(Storage!=="undefined" && localStorage.variableName!=null)

现在您可以将值设置为

container.val = localStorage.variableName

【讨论】：