Question

我正试图让我的功能无效。我需要的是能够滚动到我的div并让X出现然后我可以添加我想要的效果。

我正在使用Javascript，因为我需要跨浏览器兼容。我不想使用CSS，因为它在将来我想添加的内容非常有限。

<script>
$(document).ready(function() {
$('div.userinfo').hover({
    mouseenter: function() {
        $(this).children('div.delete').show();
    },
    mouseleave: function() {
        $(this).children('div.delete').hide();

    }
    });
    });
</script>
    <?
echo "<div class='userinfo'><div class='delete' style='cursor:pointer;position:relative;top:0px;float:right;padding-right:5px;' onclick=\"delete_('".$streamitem_data['streamitem_id']."');\">X</div></div>"

Answer 1

使用.on（）代替.hover（），不推荐使用它并且不起作用，使用.on（）：

$(function() {
    $('div.userinfo').on({
        mouseenter: function() {
            $(this).children('div.delete').show();
        },
        mouseleave: function() {
            $(this).children('div.delete').hide();

        }
    });
});

这将完成这项工作。

Answer 2

使用bind()方法代替悬停：

$(document).ready(function() {
   $('div.userinfo').bind({
     mouseenter: function() {
        $(this).children('div.delete').show();
     },
     mouseleave: function() {
        $(this).children('div.delete').hide();
     }
   });
});

注意：如果您稍后使用jQuery添加新的dom元素，请使用live()或on()，如果不是，请使用非常可靠的bind方法。

Mouseenter Hover Div显示/隐藏

2 个答案: