1

親愛なるプログラマーの皆さん、こんにちは。

テーブルフィールドをajaxで更新しようとしています。

テーブルセルをダブルクリックすると、セルの内容がテキストボックスに置き換えられ、テキストを変更した後、セルの値がテキストボックスの値で更新されます。

私の問題は、最初の変更は正常に機能しますが、2回目の変更後、以前に変更されたすべての表のセルが、クリックされたものだけでなく新しい値で更新されることです。

誰かが私を助けて正しい方向に向けることができれば素晴らしいと思います.

http://jsfiddle.net/bDxDX/3/でテストするすべてのものを見つけることができます

$(function () {
    $(".doodleEdit").dblclick(function (e) {
        e.stopPropagation();
        var currentEle = $(this);
        var value = $(this).html();
        updateVal(currentEle, value);
    });
});

function updateVal(currentEle, value) {

    $(currentEle).html('<input class="thVal" type="text" value="' + value + '" />');

    var mode = $(currentEle).attr('class').split(' ')[1];

    if (mode == 'editDescr') {
        alert("editDescr");
    } else if (mode == 'addDate') {
        alert("addDate");
    } else if (mode == 'addVote') {
        alert("addVote");
    }

    $(".thVal").focus();
    $(".thVal").keyup(function (event) {
        if (event.keyCode == 13) {
            $(currentEle).html($(".thVal").val().trim());
        }
    });

    $(document).click(function () {
            $(currentEle).html($(".thVal").val().trim());
    });
}

http://jsfiddle.net/bDxDX/3/

多くの感謝とよろしくコスタル

4

2 に答える 2

1

これであなたのケースは解決しますか? このjsfiddleを確認してください-

http://jsfiddle.net/hellomaya/bDxDX/5/

$(function () {
    $(".doodleEdit").dblclick(function (e) {
        e.stopPropagation();
        var currentEle = $(e.target);
        var value = $(e.target).html();

        console.log($(e.target));

        if ($.trim(value) === "") {
            $(currentEle).data('mode', 'add');
        } else {
            $(currentEle).data('mode', 'edit');
        }
        updateVal(currentEle, value);
    });
});

function updateVal(currentEle, value) {

    $(currentEle).html('<input class="thVal" type="text" value="' + value + '" />');

    var mode = $(currentEle).data('mode');
    alert(mode);

    $(".thVal").focus();
    $(".thVal").keyup(function (event) {
        if (event.keyCode == 13) {
            $(this).parent().html($(this).val().trim());
            $(".thVal").remove();
        }
    });
}

$(document).click(function (e) {
    if ($(".thVal") !== undefined) {
        if ($(".thVal").val() !== undefined) {
            $(".thVal").parent().html($(".thVal").val().trim());
            $(".thVal").remove();
        }
    }
});
于 2013-09-16T09:22:18.747 に答える