Question

有人可以帮我吗？ Js bin link。我正在尝试为用户构建照片上传div。我的计划是，如果用户在图片上盘旋，我会向他显示上传图片的选项。如果他离开鼠标，他只会看到个人资料图片。但问题是当用户离开鼠标时，mouseleave事件会隐藏包括图片在内的整个div。我不是jquery的专家。我认为错误是我隐藏的方式。但我无法弄清楚如何隐藏在mouseenter事件中创建的div。这是脚本。

            var imgUploadDiv = $('#promo-area');
            imgUploadDiv.mouseenter(function() {
                imgUploadDiv.append( "<div class='uploader'> <i class='fa fa-picture-o fa-4x' id='uploader-icon'></i></div>"  );
            });

            imgUploadDiv.mouseleave(function() {
                imgUploadDiv.hide();    
            });

请查看我提到的js bin链接，以便清楚地了解问题。

Answer 1

请尝试使用$( ".uploader" ).hide();。

您现在正在做的是隐藏整个div，因为您正在使用缓存变量imgUploadDiv，该变量设置为表示整个上传区域。

Answer 2

如果您只想隐藏imgUploadDiv类.uploader

的孩子，请执行此操作

imgUploadDiv.mouseleave(function() {
    imgUploadDiv.children('.uploader').hide();  
});

jquery mouseleave隐藏整个div

2 个答案: