-1

当使用在链接上进行悬停事件时，我想进行叠加。
这部分没问题，创建了叠加层，一切都很好。
但是我也想删除这个覆盖，当用户点击（或悬停）它时，这部分会产生一个奇怪的错误。
我尝试单击覆盖并且它没有关闭，没有任何反应，但是如果您将脚本粘贴到 chrome 控制台，这工作正常。js，第一部分，添加脚本：

  var overlay = jQuery('<div class="overlay"> </div>');
      $("#link-'.$myqlVideoID.'").hover(function() {
                 $("#hover-").attr("src","http://youtube.com/embed/'.$myqlVideoID.'?autoplay=1");
                 $(".drop-target").css("background-color","#070707");
                 $(".drop-target").css("padding","11px");
                 $(".drop-target").css("margin-bottom","16px");
                 $(".drop-target").show().fadeIn("3000");
                  overlay.appendTo(document.body)
           });

第二部分，删除覆盖：

$(document).ready(function() {
    $(".overlay").click(function() {
      $("#hover-").removeAttr("src");
      $(".drop-target").hide().fadeOut("3000");
      $(".overlay").remove();
      console.log("clicked");
    });
  });

我的网站是您可以看到错误的地方：http:
//neocsatblog.mblx.hu/search/
只需搜索一些内容并向下滚动到“Cimkék”

4

1 回答 1

0

尝试通过编写以下内容在叠加层上委派事件： $(document).on('click', '.overlay', function () { //The rest of your code }) ;

其余的事件处理程序也是如此。

原因是元素overlay是动态添加的，而脚本在实例化时并不知道它。

于 2015-08-29T11:13:20.793 回答