我想要一个包含所有 .slide
元素宽度的数组 slide_widths
:
$( 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]
我想当 console.log
输出一个数组时,这个 map
函数仍然有效?我怎样才能避免它?
最佳答案
您的函数似乎在元素实际加载之前就获取了元素宽度,因此尚未加载的元素返回的宽度为 0。
尝试使用 $(window).on("load", function() {
而不是 $(document).ready(function() {
$(window).on("load"
将等待页面上的所有元素加载,而 $(document).ready
则不会。
关于javascript - 刷新时宽度数组发生变化,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38747802/