Javascript 如何动态创建不同的mousedown回调？

我正在尝试创建多个div，每个div都有一个mousedown回调

但是，回调函数不应该对所有div都通用，它应该根据所单击的div而不同

下面是我正在使用的生成div和设置回调的代码

    //some number
    var num=4;

    for(var z = 0 ; z < num ;z++)
    {
        //create a div with id 'z'
        $("<div/>",{id:z}).appendTo("#empty");

        //displaying the id on the screen 
        $("#"+z).text(z);   

        console.log("button "+z+" created");

        //Callback function , which is not working as I want it to. See the bottom section for more details
        $("#"+z).mousedown(function(){
            console.log("Button "+z+" clicked !");
        });
    }

//一些数字
var-num=4；
对于（var z=0；z

上面的代码运行如下

单击任何div时，控制台中会生成消息“Button 4 clicked！”。

---

为了实现我的目标，应该做些什么？

给你的元素上一堂课。然后使用该类中单击的元素的索引来知道单击了哪个元素并对其进行操作：

//一些数字
var-num=4；
对于（var z=0；z
.mydivs{
背景色：#中交；
边缘顶部：15px；
高度：100px；
宽度：100px；
}
跟踪按钮，尝试将代码修改为：


var num=4；
var-btn；
对于（var z=0；z

#空div{
填充物：5px；
边框：1px纯灰；
边缘底部：2px；
光标：指针；
}
最好为按钮使用类，并为项目创建回调

var num=4;

for(var z = 0 ; z < num ;z++)
{
    //create a div with id 'z'
    $("<div/>",{id:z,class:'btn'}).appendTo("#empty");

    //displaying the id on the screen 
    $("#"+z).text(z);   

    console.log("button "+z+" created");
}

$(".btn").mousedown(function(){
    var z = $(this).attr('id');
    console.log("Button "+z+" clicked !");
});

var num=4；
对于（var z=0；z
解决此问题的一种方法是在for循环之外处理事件

工作代码片段：


//一些数字
var-num=4；
对于（var z=0；z

这就是您想要实现的吗？如果您打算使用类，为什么还要给divs id，特别是像0-3这样的通用id？另外，由于按钮是动态创建的，所以最好使用上的
（'mousedown'…
。我认为提供ID和类对于这种情况很好，因为它们将允许轻松追溯调用的div的索引。