Question

我试图创建一个动态创建的导航，其中每个元素都可以点击并发送到某个地方（不用担心）。这是我的代码片段：

        var navigation = $('<ul></ul>');
        for(a = 0; a < no_of_elements; a++) {
            navigation_content = $('<li></li>').click(function { send_me_to(a) });
            navigation_content.appendTo(navigation);
        }
        navigation.appendTo('.container');

一切正常，直到我在第3行添加了.click（...）。我也尝试将它分成两行，如下所示：

            navigation_content = $('<li></li>');
            navigation_content.click(function { send_me_to(a) });

......但没有结果。将click事件绑定到这些元素的正确方法是什么？提前谢谢！

Answer 1

在函数表达式中，您缺少括号()：

navigation_content = $('<li></li>').click(function() { send_me_to(a) });
//                                                ^^ missing

Answer 2

试试这个：

navigation_content.on('click',function(){
  send_me_to(a);
})

编辑：第二个解决方案：

 navigation_content = $('<li id="li-link-'+a+'" data-id="'+a+'"></li>')

在“navigation.appendTo（'。container'）;”之后添加此代码

$('li[id^="li-link"]').on('click' , function(){
send_me_to($(this).data('id'));
});

欢呼声。

Answer 3

不确定函数关键字后面的括号是否必需，但是在单击处理程序中使用a的方式将不具有您期望的结果。你可以这样做：

navigation_content.click((function(aa) {
    return function() { send_me_to(aa); };
})(a));

Answer 4

<强> jsFiddle Demo

我认为问题可能在于发送a。它可能只发送最后一个，因为它没有被关闭。还有一个语法错误，匿名点击功能需要()之后

var navigation = $('<ul></ul>');
for(a = 0; a < no_of_elements; a++) {
 navigation_content = new function(){
  var copya = a;
  return $('<li></li>').click(function() { send_me_to(copya) });
 };
 navigation_content.appendTo(navigation);
}
navigation.appendTo('.container');

动态创建动态创建的元素上的onclick事件

4 个答案: