Question

考虑以下代码......

function getItems(id, menu_id) {
    //some code
}  

$('#group-api').append('<li><a href="#" onclick="getItems(\''+data['group'][i]['id']+'\',\''+menu_id+'\');" role="tab" data-toggle="tab">'+data['group'][i]['menu_group']+'</a></li>');

如果我使用的是Chrome，则会有效，但对Firefox不适用。有解决方案吗感谢。

Answer 1

尝试相反的方式。通过jQuery创建元素，在其上附加.click()事件，然后将其附加到容器。

代码：

function getItems(id, menu_id) {
    // ...
}

$("<li><a href='#' role='tab' data-toggle='tab'>" + data['group'][i]['menu_group'] + "</a></li>")
    .appendTo("#group-api")
    .find("a")
    .click(function() {
        getItems(data['group'][i]['id'], menu_id);
    });

JSbin模拟：http://jsbin.com/dosohatawe/1/edit?js,console,output

回复评论：

您总是得到最后一个值，因为您没有使用闭包。以下是使用闭包更新的（非工作）示例：

for(var i = 0; i < data['group'].length; i++) {

    var id = data['group'][i]['id'];

    $("<li><a href='#' role='tab' data-toggle='tab'>" + data['group'][i]['menu_group'] + "</a></li>")
        .appendTo("#group-api")
        .find("a")
        .click(
            (function(a, b) {
                return function() {
                    getItems(a, b);
                };
            })(id, menu_id)
        );

}

我还没有对它进行过测试，但我认为它应该工作。

Onclick在Firefox中无效，但在Chrome中无效 - 是的

1 个答案: