不支持悬停功能

Not support hover function?

本文关键字：功能 悬停 不支持      更新时间：2023-09-26

鼠标功能无法支持

$("div.container1:has('#image')").hover(function() {
        console.log("Success hover");
 });

这是我的div类

<div class="container1">
  <img src="img/1920/blue.jpg" id="imageId"/>
 </div>

div类中用于点击操作的功能

$(document).ready(function() {
    $(".container1").click(function(e) {
        e.preventDefault();
            var x = e.pageX - this.offsetLeft;
        var y = e.pageY - this.offsetTop;
        var img = $('<button>');
        img.css('top', y);
        img.css('left', x);
        img.css('position', 'absolute');
        img.attr('type', 'button');
        img.attr('id', 'image');
        img.css('z-index', 1);
        img.attr('class', 'btn btn-info btn-lg');
        $(this).attr('data-toggle','modal');
        $(this).attr('data-target','#myModal');
        img.attr('data-toggle','modal');
        img.attr('data-target','#myModal');
        console.log("Mouse action Start");
        img.appendTo('.container1');
        /*$(this).removeClass('.container1');*/
        console.log("Mouse action End");
        $(this).removeClass('<button>'); 

    });

});

另一种选择作品的方式，jsbin

 $("div.container1 #imageId").hover(function() {
            console.log("Success hover");
  });

这是因为.hooper需要两个参数。鼠标进入时的回调和离开时的回调。

另外，您是在添加DOM元素，然后添加单击处理程序吗？如果是这样，那么您肯定需要使用.on()。

.on（）用于动态添加到DOM中的元素。您可能需要执行.on('mouseenter', [callback])和.on('mouseleave', [callback])而不是.hover()。仅供参考。

相关文章：