0

独自のデータを入力できるデータ視覚化ツールを作成しています。データ値は、次のような順不同のリストに格納されます<ul><li data-name='name'><a href='#' onclick='showEditDv(this);'>Edit</a><span class='name'>name</span><span class='seperator'> | </span><span class='value'>7</span></li></ul。リストには複数のリスト項目を含めることができます。[編集] ボタンをクリックすると、showEditDv()関数が呼び出され、それ自体への参照が与えられます。関数を示す前に、dataオブジェクトが次のように構成されていることを述べておきます。

data ->
    name: "root",
    children: [ {name: "something", size: "7"},
        {name: "something-else", size: "999"} ]

これは関数のコードです:

function showEditDv(object) {
    var name = $(object).parent().attr("data-name"),
        input = new Opentip($(object), {removeElementsOnHide: true, target: null, showOn: null, hideTrigger: "closeButton"}),
        disabled = (data.children[getChildIndexByName(name)].hasOwnProperty("children")) ? "disabled" : "";

    input.setContent("<label>Name:</label><input type='text' data-prevname='" + name + "' value='" + name + "' class='dv-add-name' /><label>Value:</label><input " + disabled + " type='text' class='dv-add-value' value='" + data.children[getChildIndexByName(name)].size + "' /><button class='callEditDv'>Apply</button>"); // Set content of opentip

    input.show();

    $("body").on("click", ".callEditDv", function() {
        var newname = $(this).siblings(".dv-add-name").val(),
            prevname = $(this).siblings(".dv-add-name").attr("data-prevname"),
            value = $(this).siblings(".dv-add-value").val();

        if (newname !== prevname)
        {
            data.children[ getChildIndexByName(prevname) ].name = newname; // Update name

            $(object).parent().attr("data-name", newname); // Update parent data

            $(object).siblings(".name").text(newname); // Update form
        }

        if (data.children[ getChildIndexByName(newname) ].size !== value)
        {
            data.children[ getChildIndexByName(newname) ].size = value;
            $(object).siblings(".value").text(value);
        }
        input.hide();
    });
}

Opentip を使用します。これは、動的なポップアップ/ツールチップを作成する方法の 1 つです。問題は、データ値を 1 回変更すると、再度変更しようとすると、コードが 2 回ループすることです。最初はすべてが期待どおりに機能しますが、2 回目は同じ を使用して再度実行します。これは、変数が返され、変数を設定できず、エラーが発生することprevnameを意味します。一致が見つかるまで名前をチェックする値をループし、配列内のオブジェクトのインデックスを返します。getChildIndexByNameundefinedgetChildIndexByNamedata.children

前もって感謝します！

4

2 に答える 2

2

これを試して：

$("body").off('click').on("click",...

jQuery ドキュメント

.bind() でアタッチされたイベント ハンドラーは、.unbind() で削除できます。(jQuery 1.7 では、要素のイベント ハンドラーをアタッチおよび削除するには、.on() および .off() メソッドが推奨されます。)

于 2013-04-05T09:29:54.947 に答える
1

変化する：

$("body").on("click",...

に

$("body").unbind('click').on("click",

この助けを願っています！

于 2013-04-05T09:24:39.377 に答える