Javascripts未完全加载jQuery ajax内容

Javascripts not fully loading in jQuery ajax content

本文关键字：jQuery ajax 内容 加载 Javascripts      更新时间：2023-09-26

我有一个问题，自从我昨天开始寻找它以来，它一直让我头疼。

我有几个jQuery脚本，我的页面包括.load jQuery ajax（在页面底部）。

我对图像使用悬停效果，并在 js/tools 中使用位于 js/tools 中的标题的固定位置.js

问题是，随机地，我的浏览器不会将工具加载到ajax中.js。因此，有时您在加载的 ajax 内容中看不到图像悬停效果。刷新页面时，它很好。

我

的第一个赌注是我使用的脚本发生冲突，或者内容或.js的加载顺序有问题。

.js：

$(document).ready(function() {
    $('.cta-btn, .portf1, .portf2, .portf3, .portf4, .portf5, .btn-facebook, .btn-twitter, .btn-linkedin, .btn-studiofacebook, .btn-studiotwitter,.btn-studiolinkedin,.newsitem1, .newsitem2, .newsitem3').append('<span class="hover"></span>').each(function () {
        var $span = $('> span.hover', this).css('opacity', 0);
        $(this).hover(function () {
            $span.stop().fadeTo(200, 1);
        }, function () {
    $span.stop().fadeTo(400, 0);
        });
    });
});
$(function(){
     var stickyHeaderTop = $('#stickyheader').offset().top;
     $(window).scroll(function(){
             if( $(window).scrollTop() > stickyHeaderTop ) {
                     $('#stickyheader').css({position: 'fixed', top: '0px'});
                     $('#stickyalias').css('display', 'block');
             } else {
                     $('#stickyheader').css({position: 'static', top: '0px'});
                     $('#stickyalias').css('display', 'none');
             }
       });   
});

.html：

<!-- portfolio -->
<div id="portfoliowrapper">
<div id="portfolioitems"></div>
<script>$("#portfolioitems").load("werk.html #portfolio");</script>
<div class="clear"></div>
<a href="werk.html" class="cta-btn"><h2 class="btn">Werk</h2></a>
</div>

有什么想法吗？提前感谢！

您需要显示一些代码，您不能指望我们挖掘您的网站。

您很可能正在使用

$(function(){
   // code that depends on images being loaded here
});

但是，这不会等待图像加载，它只会等到 DOM 准备好修改。等待图像的事件是窗口的加载事件。

$(window).load(function(){
   // here all images in the HTML are guaranteed to be loaded
});

第二次运行页面时，图像在缓存中，并且在 DOM 准备就绪时已经加载，即来自您的$(document).ready()处理程序

问题就在这里：

$("#portfolio").offset() is null
Line 33

根据萤火虫的说法。看起来您正在尝试在页面完全呈现之前调用函数，这会导致错误，因为它无法计算偏移量并破坏函数的其余部分。

相关文章：