Jquery设置了没有元素的onclick事件

Jquery set onclick event without element

本文关键字：onclick 事件 元素 设置 Jquery      更新时间：2023-09-26

我正在写一个卡片列表
在我抽卡之前，卡片列表如下：

<div id="cards-div">
    <ul id="cards-list">
    </ul>
</div>

我抽完一张卡后，卡片列表如下：

<div id="cards-div">
    <ul id="cards-list">
        <li>hello</li>
    </ul>
</div>

如何添加onclick函数同时接收索引：

<div id="cards-div">
    <ul id="cards-list">
        <li onclick="mouseoverCard(index)">hello</li>
    </ul>
</div>
mouseoverCard: function(index) {
    alert(index);
}

请注意，我曾尝试使用jquery.click（）声明mouseover函数，但它只有在DOM存在时才有效。即使DOM不存在，我也要声明函数。

据我所知，父<ul>元素是静态的。因此，您可以使用事件委派：

$("#cards-list").on("click", "li", function(e) {
    var i = $(this).index();
    // ...
});

委托事件方法只将事件处理程序附加到一个元素#cards-list，并且事件只需要上升一个级别（从单击的li到ul）：

$("#cards-list").on("click", "li", function(event){
     alert($(this).index());
});

参考：.on（）

相关文章：