当用户滚动位置到达时，将JavaScript加载到div

我只想在用户到达时将脚本加载到div中。我正在尝试使用jQuery完成此操作，但没有成功。也许你可以帮忙。这里是代码：当用户滚动位置到达时，将JavaScript加载到div

var scrollFromTop = $("#float_div_id").offset().top; 

$(document).scroll(function() { 
    if ($(this).scrollTop() > scrollFromTop) { 
     var s = document.createElement('script'); 
     s.setAttribute('type', 'text/javascript'); 
     s.src = 'javascript code src which i want to append on scroll'; 
     document.getElementById('float_div_id').appendChild(s); 
    } 
});

来源

2015-04-29 Pandemum

只是一个方面的问题：为什么要创建DOM里面的脚本元素？它是如此之重，你不能先包含它？ – briosheje

基本上div是空的。我想追加将加载该div内容的脚本。我不想加载该脚本，直到用户到达div，当用户到达它，我想加载该特定的div内的脚本。 – Pandemum

为什么不实现一个函数，当用户滚动该div时，加载所需的内容？我的意思是，我不明白为什么要加载脚本而不是内容。 – briosheje

在你的情况，$(this).scrollTop()会出现比scrollFromTop小。

更改你的，如果条件并再次尝试：

if ($(this).scrollTop() + $(window).height() > scrollFromTop)

来源

2015-04-29 12:46:01

在我的情况下，问题是console.log给我留言，我已滚动到特定点，但内容未被加载。 – Pandemum

你应该看看waypoint library。它触发事件的特定元素，当用户滚动并可以执行一些编码

var waypoint = new Waypoint({ 
    element: document.getElementById('thing'), 
    handler: function(direction) { 
    alert('You have scrolled to a thing') 
    } 
})

然后滚动之后，你应该使用$.getScript()一个单独的JS文件（诱惑）：

说明：使用GET HTTP请求从服务器加载JavaScript文件，然后执行它。

$.getScript('/javascript/myscript.js');

而且要小心使用，如果一些代码需要新的js文件异步：

$.getScript('/javascript/myscript.js', function() { 
    // do something here 
});

让我知道，如果这对你的工作：d

来源

2015-04-29 12:41:57 sebastienbarbier

在我的情况下，问题是console.log给我留言，我已滚动到特定点，但内容未被加载。 – Pandemum

你想把HTML或Javascript代码放在你的'float_div_id'中吗？ – sebastienbarbier

我正在尝试加载javascript – Pandemum

当用户滚动位置到达时，将JavaScript加载到div

回答

相关问题