0

問題は簡単です。HTMLにチェス盤のようなものがあります。フィールドには座標があり、ID 属性 (ROW|COLUMN) に格納されます。特定のフィールドをクリックすると、マーク/マーク解除されます。さらに、選択したフィールドの行と列は<input type="hidden"/>、ROW|COLUMN、ROW|COLUMN、...の形式で格納されます。

クリックするたびに、input hidden の値を処理して、フィールドが既に保存されているかどうかを確認したり、新しいフィールドを追加したり、既存のものを削除したりする必要があります。少しぎこちないです。より良い方法はありますか？それともそれが最善の方法ですか？:)

4

1 に答える 1

0

フィールドの状態を入力フィールドに保存する必要はありません。グローバル 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 を記述してください。

于 2012-07-22T09:03:17.963 に答える