3

重複の可能性:
ループ内の Javascript クロージャー - 簡単な実用例

「ダッシュボード」Web ページのステータスの表を作成しています。各ステータスは、「オン」または「オフ」の状態です。

button/buttonsetjQueryを使用してスイッチ/トグル コントロールを使用し、ユーザーがステータスの値を切り替えられるようにしようとしています。ajax データベース クエリの結果として、テーブルとボタンを動的に作成します。

基本的に、ユーザーがボタンの 1 つをクリックしたときに ajax クエリを起動しようとしていますが、クリック イベントを適切に割り当てるのに苦労しています。

私の最初のラウンドでは、どのボタンがクリックされても、最終的なリスト値が発生しました。

だから、あはは！これは、標準的な「JavaScript クロージャ」の問題です。（ので、私は考えました...）

さらにいじっても何も得られず、クロージャの問題を十分に理解していないため、私の手法が間違っている理由を理解できません。

呼び出したいコードは次のとおりです。

function SetStatus(item, status) {
    var params = '{itemName: "' + item + '", status: "' + status + '"}';
    $.ajax({
        type: "POST",
        url: "WebServices/Dashboard.asmx/SetItemStatus",
        data: params,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: StatusSet,
        error: ShowError
    });
}

私が試しているコードの現在のバージョンは次のとおりです。

$(itemOnButton).click(
    function (_item) {
        SetStatus(_item, 'On');
    } (itemName)
);

その結果、データベースから結果を取得するとすぐに (結果が表示される前に)、== 'On' のSetStatus最後のアイテムに対して起動します。status

私はこれが単純であることを知っており、基本的な閉鎖の問題であると確信していますが、頭を壁にぶつけています! 助けてくれてありがとう！

4

1 に答える 1

6 
$(itemOnButton).click(
    function (_item) {
        SetStatus(_item, 'On');
    } (itemName)
);

現在、クリックを要求するときに「クロージャ」関数を起動しています。試す

$(itemOnButton).click(
    function (ev) { 
        // this is the clicked element
        // ev is the event object

        // how do you get the name?
        // var itemName = $(this).attr("name");

        SetStatus(itemName, 'On');
    }
);

あなたもすることができます

$(itemOnButton).click(
    function (_item) {
        return function (ev) {
            SetStatus(_item, 'On');
        };
    } (itemName)
);

これで、実行したように起動しますが、すぐには実行されず、代わりにクリックのイベント処理関数が返されます。

返されるイベント処理関数は、_itemのクロージャーになりました。匿名関数は_itemのスコープであり、引数によってitemNameに設定されます。

于 2012-11-09T16:20:54.397 に答える