jQuery-> XML->数组-动态创建的按钮和链接

Question

是否简单，但需要您的帮助：

我需要在jQuery中动态创建按钮和链接。 从XML加载的数据放在一个数组中，现在：

您可以单击“类别”，“用户”等按钮之一...它会启动一个函数，该函数应该为每个类别创建一个按钮，例如：让我们创建一个将由这些按钮启动的函数：它将在XML中搜索categoryID attr，其中包含带有“ something ...”的txt，并将其添加到#tester中：

function clickedCat(cat){
      alert("test btn" + cat); // to check if function started
      // here just some script search 'cat' in XML etc...
    })
}

现在该功能必须由动态创建的按钮f.ex.触发：

function showCatName(){
    $("#categories").html(" ");
    for(i=0;i<catArr.length;i++){
    qw = catIDArr[i];
    $("<div id='showCatName"+qw+"'></div>").html("<input id='showCatName"+qw+"' type='button' title='showCatName"+qw+"' value='showCatName"+qw+"' />")
                        .click(function(event){clickedCat(qw)}).appendTo("#categories");
    }
}

但是此处创建的按钮对所有按钮都具有相同的值-上一次加载的qw ...

问：如何让它记住qw值-每个btn不同？ 因此btn [0]启动qw [0]，btn [1]启动qw [1]等...

第二件事-同样的问题，但我需要将其输入到html链接中：

function showCatName2(){
    $("#categories").html(" ");
    for(i=0;i<catArr.length;i++){
    qw2 = catIDArr[i];
    $("<div id='showCatName"+qw2+"'></div>")
    .html("<a href='#' onclick:clickedCat("+qw2+")> Test btn"+qw2+"</a>")
    .appendTo("#categories2");
    }
}

onclick似乎根本不起作用...

Q1：如何使其起作用，以便它将动态创建按钮来启动具有不同值的功能？

Q2：像上面，但不是按钮，我需要将其放在链接中

预先感谢您的帮助，卢卡斯

Answer 1

您在使用showCatName()遇到关闭问题。 当你这样说：

function(event){ clickedCat(qw) }

您正在将对qw的引用绑定到该函数，但这不会评估 qw 。 触发点击处理程序时，将评估qw变量，并且qw的值将是循环完成时的值； 所有点击处理程序将具有相同的qw值，因为它们都共享完全相同的变量。 通常的解决方案是在构建点击处理程序时强制评估qw ：

function make_click(qw) {
    return function() { clickedCat(qw); };
}
// ...
function showCatName(){
    $("#categories").html(" ");
    for(i=0;i<catArr.length;i++) {
        qw = catIDArr[i];
        $("<div id='showCatName"+qw+"'></div>")
            .html("<input id='showCatName"+qw+"' type='button' title='showCatName"+qw+"' value='showCatName"+qw+"' />")
            .click(make_click(qw))
            .appendTo("#categories");
    }
}

您可以使用立即执行的内联函数代替make_click()但如果遇到闭包问题，上述内容可能会更清楚。

您的第二个不起作用，因为onclick:clickedCat在HTML中没有任何意义。 也许您的意思是onclick=clickedCat 。 您可能会遇到用这种方法引用qw2问题。