0

jQuery ダイアログの動的ボタンを作成しています。json オブジェクトには、ボタンの情報が含まれています。オブジェクト内の各プロパティをループするために for in ループを使用しています。新しいオブジェクトをループすると、各ボタンに設定されている匿名関数は空白になりますが、ダイアログで実際にクリックすると、各関数に最後の値が設定されていることがわかります。

ダイアログのコード:

$('#dialogDiv').dialog({
        autoOpen:false,
        modal:true,
        resizable:false,
        width: 600,
        height:100,
        position:"center",
        overlay: { 
            opacity: 0.2, 
            background: "black" 
        } 
});

json オブジェクトからボタンを作成するコード:

var obj1 = {but1:{Label:"button1"},but2:{Label:"button2"},but3:{Label:"button3"}};
var newObj = {};
for(var k in obj1){
    if (obj1.hasOwnProperty(k)){ 
        var ob2 = obj1[k];
        for(var x in ob2){
            var nl = ob2[x];
             newObj[nl] = function(){
                $(this).dialog("close");
                console.log(nl);
             }
        }
    }
}

newObj をループすると、各関数は空白になります。

for(var z in newObj){
    console.log(newObj[z]);
}

ボタン オブジェクトをダイアログに追加し、それを開きます。

$('#dialogDiv').dialog({buttons : newObj});             
$('#dialogDiv').dialog("open");

いずれかのボタンをクリックすると、関数内の nl 変数の値がすべて同じであることがコンソールに表示されます。これが正しく設定されていないのはなぜですか？可変範囲？これは 2 番目の for ループを使用しない方が簡単に記述できることはわかっていましたが、ネストされたループのスコープの問題だと思いました。これを行う関数を起動するクリック イベントのコードも含めませんでしたが、それは問題ではありません。

4

1 に答える 1

1 
var obj1 = { but1: { Label: "button1" }, but2: { Label: "button2" }, but3: { Label: "button3" } };
    var newObj = {};
    for (var k in obj1) {
        if (obj1.hasOwnProperty(k)) {
            var ob2 = obj1[k];
            for (var x in ob2) {
                var nl = ob2[x];
                var testfn = function (j) {
                    return function () {
                        alert("clicked on" + j);
                    }
                }
                newObj[nl] = testfn(nl);
            }
        }
    }


    for (var z in newObj) {
        newObj[z]();
    }
于 2012-06-20T18:48:08.153 に答える