Question

我在这里有此代码：

jQuery(document).ready(function () {
    window.onresize = function() {
        alert("changed");
    }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
</div>

我现在更改窗口大小的内容，我需要检查我的一个孩子是否比另一个孩子大。如果为true，我想为所有孩子添加一个wrapped类。如何在JavaScript或jQuery中做到这一点？

Answer 1

检查如果我理解正确

jQuery(document).ready(function () {
    window.onresize = function() {
        var winWidth = $(window).width()
        $('.child','.container').each(function(idx,item){
            if($(item).width() > winWidth)
              console.log(item,$(item).index())
        })
        
        alert("changed");
    }
});

.child{
width:800px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
</div>

检查窗口调整大小时所有元素的大小是否相同

1 个答案: