用于循环的Jquery动态按钮对话框不会填充函数

时间:2012-06-20 17:53:38

标签: javascript jquery loops dialog

我正在为jQuery对话框创建动态按钮。 json对象包含按钮的信息。我使用for循环来遍历对象中的每个属性。当我循环遍历新对象时,为每个按钮填充的匿名函数是空白的,但显示在对话框中实际单击时,每个函数都填充了最后一个值。

对话框的代码:

$('#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变量都具有相同的值。为什么没有正确设置?可变范围?我知道这可以写得更容易,不使用第二个for循环,但我认为这是嵌套循环的范围问题。我也没有包含触发执行此操作的函数的click事件的代码,但这不是问题。

1 个答案:

答案 0 :(得分: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]();
    }