jquery - 使用JQuery将鼠标悬停在动态列表上时如何将光标更改为指针

Question

我有一个在屏幕加载后要附加的列表。我想在悬停后将光标更改为指针。到目前为止，我已经尝试使用 .on 事件，但它似乎不起作用。请查看带有...的行 $('.item').on('mouseover', function() { $('.item').css('cursor', 'pointer');
});

$(document).ready(function() {
    $('input').focus(function() {
        $('input[name=checklistInput]').css('outline-color','#FF0000');
    });
    $('#add').click(function() {
        var toAdd = $('input[name=checklistInput]').val();
        $('.list').append('<div class="item">' + toAdd + '</div>');
        $('input[name=checklistInput]').val('');
    });

    $('.item').on('mouseover', function() {
        $('.item').css('cursor', 'pointer');    
    });

    $(document).on('click','.item', function() {
    $(this).remove();
    });
});

如果您需要有关上述代码的总体目标的更多详细信息，请告诉我。

谢谢，

Answer 1

如何使用:hover伪CSS 来使用纯 CSS

.item:hover { cursor: pointer; }

如果您必须使用 javascript，请使用mouseenter而不是mouseover并重置为默认 on mouseleave。

Answer 2

您可以使用纯 css 实现此目的。使用 :Hover 没有任何意义。

.item{

 cursor:pointer;
}

Answer 3

只需使用 css

.item:hover {cursor : pointer}