jquery 无法使用引导轮播脚本读取未定义的属性“offsetWidth”

pdkcd3nj  于 2023-03-22  发布在  jQuery
关注(0)|答案(8)|浏览(129)

我用Bootstrap 3.3创建了一个carousel,它在我的本地机器上工作,但是当我把整个东西上传到服务器上时, Bootstrap 的js文件正在与其他文件一起编译在一个文件中,我得到了这个错误:
Cannot read property 'offsetWidth' of undefined-有没有人遇到过这个问题,有没有任何已知的解决方案?

ugmeyewa

ugmeyewa1#

对我来说,这是因为我没有在任何幻灯片上设置active类。

yhuiod9q

yhuiod9q2#

我把class='carousel-item'改成了class='item'

<div class="item">
    <img class="img-responsive" src="..." alt="...">
</div>
smdncfj3

smdncfj33#

在页面加载时删除'Carousal slide'类,并在图像加载时使用jquery动态添加。

lvmkulzt

lvmkulzt4#

我得到了同样的错误。因为我使用了v4的alpha类名,如carousel-control-next当我用v3更改时,问题解决了。

mw3dktmi

mw3dktmi5#

我得到了同样的错误,但在我的情况下,我写了carousel item的类名为.carousel-item,bootstrap.css引用的是. item.所以错误解决了. carousel-item重命名为item

<div class="carousel-item active"></div>

更名为:

<div class="item active"></div>
dfuffjeb

dfuffjeb6#

“更改为if(typeof $next == 'object' && $next.length)$next[0].offsetWidth”-没有帮助。如果您将Bootstrap 3转换为php(WordPress主题),当添加WP_Query($loop = new WP_Query($args);$count = 0;.和和在endwhile之前的end;add $count++;。

trnvg8h3

trnvg8h37#

如果你使用的是编译后的bootstrap,修复它的方法之一是编辑bootstrap.min.js

$next[0].offsetWidth

强制回流更改为

if (typeof $next == 'object' && $next.length) $next[0].offsetWidth // force reflow
46scxncf

46scxncf8#

当我创建一个动态模式弹出窗口时,我遇到了这个问题,我找到了一个解决方案,即默认情况下,幻灯片上需要一个空白的活动项目-项目设置为活动,没有任何内容。

<div class="carousel-inner" role="listbox">
    <div class="item active"></div>
    //some slides items was addêd dynamic from database.....
    </div>

希望这个解决方案对你有帮助

相关问题