如何保存javascript所做的內容更改

Question

我有一些包含行和單元格的表格。 我可以使用jquery編輯內部表內容。 但是我如何保存這些編輯？ 我的桌子：

<table border="1" cellspacing="0">
<tr>
    <th>Teams</th>
    <th>Points</th>
</tr>
<tr>
    <td>Arsenal</td>
    <td id="points">35</td>
</tr>
<tr>
    <td>Liverpool</td>
    <td>33</td>
</tr>
<tr>
    <td>Chelsea</td>
    <td>33</td>
</tr>
<tr>
    <td>Man City</td>
    <td>32</td>
</tr>
<tr>
    <td>Everton</td>
    <td>31</td>
</tr>
</table>

我的Jquery代碼：

<script>
    $(document).ready(function () {
    var val = $("#points").text();
    $("#ss").click(function () {
        val++;
        $("#points").text(val);
    })
})
</script>

<button id="ss">Inc</button>

通過單擊帶有“ss” id button ，帶有“points” id的td值會增加。 那么我如何將這種增加保存並更新為當前文件（沒有刷新頁面）？

Answer 1

試試Html5 Storage jQuery插件

如果您在項目中使用jQuery並且想要使用本地存儲或會話存儲，那么這就是您的庫。 如果用戶的瀏覽器不支持它們，它將使用cookie。

參考

https://github.com/artberri/jquery-html5storage/

使用AJAX

$(function(){
    var val = $("#points").text();
    $("#ss").click(function () {
        val++;
        $("#points").text(val);
        $.ajax({
            type: "POST",
            url: "some.php",
            data: { points: val }
            })
            .done(function( msg ) {
            alert( "Data Saved: " + msg );
        });
    })
})

some.php

$point = $_POST['points'];
//CODE TO SAVE TO DATABASE GOES HERE

Answer 2

嘗試這個 ：

儲藏 ：

<script>
$(document).ready(function () {
var val = $("#points").text();
$("#ss").click(function () {
    val++;
   window.localStorage.setItem("storedValue", val);
    $("#points").text(val);
})
 })
</script>

為了獲得價值：

var value = window.localStorage.getItem("storedValue");