在JavaScript中存储数据以进行服务器端处理

Question

问题很简单。 我有一些像在HTML棋盘。 这些字段具有坐标，存储在ID属性（ROW | COLUMN）中。单击特定字段将其标记/未标记。 而且，所选字段的行和列以ROW | COLUMN，ROW | COLUMN，...的形式存储在<input type="hidden"/>中。

对于每次单击，我必须处理隐藏的输入值，以检查该字段是否已存储，添加新字段，删除现有字段等。 有点尴尬。 有没有更好的方法？ 或者也许这是最好的方法？

Answer 1

您不必将字段状态存储在输入字段中。 在将其发送到服务器之前，最好使用全局JavaScript数组或操作DOM并序列化其状态。

这是JSFiddle中的一些示例代码： http : //jsfiddle.net/U2D9Q/

重要的部分是列的className所在的位置

$td.bind("click", function(e) {
    $(this).toggleClass("selected");
});

以及单击按钮时的序列化方式

var serialize_table = function() {
    var output = new Array();

    $("table tbody").children().each(function(y) {
        var row = new Array();

        $(this).children().each(function(x) {
            row[x] = $(this).get(0).className;
        });

        output[y] = row;
    });

    return output;
}

我使用jQuery来保持代码干净。 随意使用任何您喜欢的JS框架或编写本机JS。