Question

我希望数组slide_widths的宽度为所有.slide元素：

$( document ).ready(function() {
  var $slider = $('.slider ul');
  var slider_width = $slider.width();
  var $slides = $('.slide');
  var slide_widths = $.map($slides, function(slide) {
    return slide.getBoundingClientRect().width;
  });

  console.log(slide_widths);
});

刷新页面时，我得到了不同的结果：

1. [201.328125, 180, 214.28125, 180, 180, 180, 168.46875, 180, 145.078125, 144, 142.1875, 250.6875, 0, 0, 0, 0, 0, 0, 0, 0]

2. [201.328125, 180, 214.28125, 180, 180, 180, 168.46875, 180, 145.078125, 144, 142.1875, 250.6875, 155.515625, 180, 180, 176.03125, 0, 0, 0, 0]

我想当map输出一个数组时，这个console.log函数仍在工作？我怎么能避免它？

Answer 1

看起来你的函数在实际加载之前抓取了元素宽度，因此尚未加载的元素返回宽度为0。

尝试使用$(window).on("load", function() {代替$(document).ready(function() {

$(window).on("load"会等待页面上的所有元素加载，而$(document).ready则不会。

刷新时宽度数组会发生变化

1 个答案: