文章/答案/技术大牛

发布

社区首页 >问答首页 >元素不会隐藏- Jquery

问元素不会隐藏- Jquery
EN

Stack Overflow用户

提问于 2020-02-01 07:26:13

回答 2查看 49关注 0票数 0

我有几个包装器，其中包含一个加载gif，而真正的图像加载。

我还有一些jquery，一旦加载了真实的图片，它就会隐藏gif，但加载的gif不会隐藏。如果我将$(this)替换为$(".displayImg")，它将工作，但它将影响所有加载的gif。为什么$(this)不隐藏它？

$('.displayImg').on("load", function() {
  $(this).parent().find(".loadingImage").hide();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='wrapper'>
  <img class='loadingImage' src='https://media0.giphy.com/media/xTk9ZvMnbIiIew7IpW/giphy.gif'>

  <img class='displayImg' src='https://via.placeholder.com/350x150'>
</div>

<div class='wrapper'>
  <img class='loadingImage' src='https://media0.giphy.com/media/xTk9ZvMnbIiIew7IpW/giphy.gif'>

  <img class='displayImg' src='https://via.placeholder.com/200x100'>
</div>

jquery

html

回答 2

Stack Overflow用户

回答已采纳

发布于 2020-02-01 08:29:45

您的代码运行良好，但您可以像这样改进它：

$('.displayImg').on("load", function() {
  $(this).prev(".loadingImage").hide();
});

票数 0

Stack Overflow用户

发布于 2020-02-01 07:57:44

你根本不需要使用Javascript。一种方法是将加载器作为背景图像。当实际的图像加载时(假设它没有任何透明度)，它将覆盖加载器。您可以随心所欲地调整加载器的大小和位置。

.wrapper1 {
  width: 350px;
  height: 150px;
  background-image: url(https://media0.giphy.com/media/xTk9ZvMnbIiIew7IpW/giphy.gif);
}

.wrapper2 {
  width: 200px;
  height: 100px;
  background-image: url(https://media0.giphy.com/media/xTk9ZvMnbIiIew7IpW/giphy.gif);
  background-position: 50% 50%;
  background-size: contain;
  background-repeat: no-repeat;
}

<div class='wrapper1'>
  <img class='displayImg' src='https://via.placeholder.com/350x150'>
</div>

<div class='wrapper2'>
  <img class='displayImg' src='https://via.placeholder.com/200x100'>
</div>

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/60012586

复制

相似问题

问元素不会隐藏- Jquery
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问元素不会隐藏- JqueryEN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问元素不会隐藏- Jquery
EN